自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

歪脖先生的博客

分享Web知识,交流Web经验

原创 《揭秘 CSS》开源啦

《揭秘 CSS》将整个 CSS 体系作为一个有机整体,系统介绍整个 CSS 体系,全面涵盖 CSS1、CSS2.1、CSS3。内容由浅入深,从基础讲起,逐步深入,让零基础的 web前端工程师从入门到完全精通CSS。 《揭秘 CSS》采用创意共享4.0许可证,只要保持原作者署名和非商用,您可...

2018-02-27 22:03:16 374 0

原创 JSON和JavaScript对象互转
原力计划

JSON的本质是一个字符串,它之所以受欢迎,是因为可以把JSON字符串解析为有用的JavaScript对象。 ECMAScript5中,对解析JSON的行为进行了规范,并定义了一个全局对象JSON,该对象有两个方法:JSON.parse() 和 JSON.stringify()。 JSON.p...

2020-04-01 22:43:02 75 0

原创 JSON 数组

遍历 JSON 数组 你可以使用 for-in循环来遍历数组: for(iinmyObj.sites){ x+=myObj.sites[i]+"<br>"; } 你也可以直接使用 for 循环来遍历数组: for(i=0;i<myObj.sites...

2020-03-28 23:10:43 24 0

原创 JSON 对象

访问 JSON 对象的值 可以使用点号(.),或中括号([])来访问 JSON 对象的值。 使用点号访问对象时,直接使用对象的 key 来访问, key 无须放在双引号中。如: <script> varmyObj,x; myObj={"github":&...

2020-03-28 23:07:33 28 0

原创 JSON语法

JSON语法 JSON 键/值对 JSON键/值对由键和值组成,键必须是字符串,值可以是字符串(string)、数值(number) 、对象(object)、数组(array)、true、false、null。如图 1‑1所示: 图1-1 JSON的值 在定义JSON键/值时,先是键名...

2020-03-27 22:58:42 43 0

原创 JSON简介

JSON简介 什么是JSON JSON是JavaScript Object Notation的简称,中文含义为“JavaScript 对象表示法”,它是一种数据交换的文本格式,而不是一种编程语言。 JSON 是一种轻量级的数据交换格式,它基于 ECMAScript (w3c制定的js规范)的...

2020-03-27 22:52:21 154 0

转载 windows2008R2+IIS部署python Django的web环境

windows2008R2+IIS部署python Django的web环境这篇文章写得非常好,非常仔细,它完全可以指导在 windows2008R2+IIS中部署python Django的web环境。 这篇文章中,作者把所有的坑都明确标识出来,可以少走很多弯路。感谢作者潇洒哥Kahn的辛苦付...

2020-02-20 13:46:37 82 0

原创 Bootstrap3 Font Awesome 字体图标的堆叠

堆叠的图标 Font Awesome还支持将多个图标叠加在一起组成一个复合图标。如果想要将多个图标堆叠起来,需要给容器元素添加.fa-stack类,为图标元素使用.fa-stack-1x作为正常比例的图标,使用.fa-stack-2x作为大一些的图标。还可以为图标元素使用.fa-inverse类...

2019-06-05 15:04:22 287 0

原创 Bootstrap3 Font Awesome 字体图标带动画的图标

带动画的图标 Font Awesome不仅支持固定角度的旋转,还提供了带动画的旋转图标。可以使用.fa-spin类让任意图标动态持续旋转,还可以使用.fa-pulse类让图标以 8 步为周期进行旋转,它们尤其适合表示刷新、加载等功能的图标,如.fa-spinner、.fa-refresh和.fa...

2019-06-05 15:03:27 285 0

原创 Bootstrap3 Font Awesome 字体图标旋转或翻转图标

旋转或翻转图标 Font Awesome提供了一组样式类,可以对图标进行固定角度的旋转或翻转。这些类分别是 .fa-rotate-90(顺时针旋转90度)、.fa-rotate-180(顺时针旋转180度)、.fa-rotate-270(顺时针旋转270度)、.fa-flip-horizonta...

2019-06-05 15:02:39 980 0

原创 Bootstrap3 Font Awesome 字体图标带边框的图标

带边框的图标 使用.fa-border类,可以类轻易构造出带有圆角边框的图标。还可以添加.pull-right或.pull-left类,让图标向右或向左浮动,所有图标都支持这两个类。如: <div> <iclass="fa fa-quote-left fa-3x ...

2019-06-05 15:01:53 144 0

原创 Bootstrap3 Font Awesome 字体图标的尺寸

图标的尺寸 通过应用.fa-lg、.fa-2x、.fa-3x、.fa-4x、.fa-5x类,让图标变得更大。按先后顺序,这些类所对应的图标大小按 33% 依次递增。如: <iclass="fa fa-camera-retro fa-lg"></i> ...

2019-06-05 15:01:00 243 0

原创 Bootstrap3 Font Awesome 字体图标的基本图标

基本图标 Font Awesome图标跟Glyphicon图标的用法完全相同,所有图标都需要一个基类 .fa和对应每个图标的 .fa-*类。只需创建一个行内元素,并为它应用图标类,即可使用Font Awesome图标。如: <iclass="fa fa-camera-r...

2019-06-05 14:59:34 301 0

原创 Bootstrap3 Font Awesome 字体图标

简介 Font Awesome 是一套绝佳的图标字体库,它提供可缩放的矢量图标,并且可以通过CSS来设置大小、颜色、阴影或者其它任何支持的效果。Font Awesome具有以下特性: 一个字库,675 个免费图标。 完全免费,包括商业用途。 最初是为Bootstrap设计的,现在可以适用于...

2019-06-05 14:58:14 225 0

原创 Bootstrap3 Affix插件

Affix Affix插件(affix.js)是一个很有用的插件,它可以让你的导航始终都固定在某个位置。一开始的时候,导航出现在页面的某个位置,当页面滚动一定距离时,无论页面如何滚动,它都固定在一个位置,就像被帖在页面上一样。 Affix插件被翻译为多种中文名称,如粘条、固定导航等,每种翻译都...

2019-06-04 16:19:01 360 0

原创 Bootstrap3 输入提示插件typeahead

输入提示 输入提示是一个表单输入辅助类型的插件,它简单、易于扩展,可以在用户输入过程中,针对用户的输入快速地给出输入提示。 在Bootstrap2中,输入提示是一个标准插件,到了Bootstrap3,它已经被独立出来,不再是Bootstrap的标准插件。如果要使用输入提示插件的功能,可以从Bo...

2019-06-04 16:18:17 887 0

原创 Bootstrap3 轮番插件的事件

轮番插件的事件 Bootstrap为轮番插件定义了两个事件,通过这些事件,可以监听播放行为及轮番组件的状态。这些事件及含义见表 4‑12。 表 4‑12 轮番插件的事件及含义 事件 含义 slide.bs.carousel 当 slide 实例方法被调用时,立即触发该事件 ...

2019-06-03 16:23:36 58 0

原创 Bootstrap3轮番插件的选项

轮番插件的选项 Bootstrap为轮番插件提供了 4 个选项,这些选项都可以通过 data 属性或JavaScript进行设置。选项的详细说明见表 4‑11: 表 4‑11 carousel插件的选项 名称 类型 默认值 说明 interval number ...

2019-06-03 16:22:54 55 0

原创 Bootstrap3 轮番插件的调用方式

轮番插件的调用方式 1、JavaScript调用 JavaScript调用轮番其实很简单,只需在脚本中调用 carousel() 方法即可。格式为: $('.carousel').carousel(); 除此之外,Bootstrap还提供了其它一些方法,可以根据需...

2019-06-03 16:22:18 53 0

原创 Bootstrap3 轮番插件的使用方法

轮番 Bootstrap 的轮番插件(carousel.js)是一个灵活的、响应式的、无缝循环播放的幻灯片切换插件,它的内容可以是图片、视频、或者其他任何内容。 使用方法 Bootstrap中的轮番由一个 class="carousel" 的容器定义,其中包含轮番指示器、...

2019-06-03 16:21:32 128 0

原创 Bootstrap3 折叠插件的事件

折叠插件的事件 Bootstrap还为折叠组件提供了一组事件,通过这些事件,可以监听用户的行为及折叠组件的状态。这些事件及含义见表 4‑10。 表 4‑10 折叠插件的事件及含义 事件 含义 show.bs.collapse 调用show方法时,立即触发该事件 shown...

2019-06-02 18:52:17 300 0

原创 Bootstrap3 折叠插件的选项

折叠插件的选项 Bootstrap为折叠插件提供了 2 个选项,所有的选项都可以通过 data 属性或JavaScript进行设置。见表 4‑9。 表 4‑9 collapse插件的选项 名称 类型 默认值 说明 parent 选择器 false 如果...

2019-06-02 18:51:35 225 0

原创 Bootstrap3 折叠插件的调用方式

折叠插件的调用方式 折叠插件的结构相对复杂,但调用比较简单,可以通过data属性调用,也可以通过JavaScript调用。 1、data 属性调用 要激活折叠插件的激活行为,首先为标题部分的链接定义 data-toggle="collapse" 属性,还要为包含框定义 i...

2019-06-02 18:50:24 164 0

原创 Bootstrap3 折叠插件的使用方法

折叠 折叠插件(collapse.js)可以很容易地让页面区域折叠起来。当列表菜单的条目特别多,而页面空间有限时,使用类似于手风琴的折叠菜单可以节约页面空间,方便用户浏览。 使用方法 Bootstrap中,折叠组件的基本结构是在一个 class="accordion" 的...

2019-06-02 18:49:16 625 0

原创 Bootstrap3 按钮组插件

按钮组 将按钮组放在特定的容器中,不必编写JavaScript代码,就可以让按钮组具有HTML的复选框(checkbox)或单选框(radio)的效果。 1)复选按钮组 复选按钮组是类似于复选框的一组按钮,用户可以选择按钮组中的多个按钮。要添加这个功能,只需给 .btn-group 的按钮组...

2019-06-01 17:54:21 149 0

原创 Bootstrap3 按钮状态切换

按钮状态切换 将单个按钮的 data-toggle 属性设置 button,或通过简单的JavaScript编程,就可以激活按钮的行为状态,让它在未激活和激活状态之间来回切换。如: <buttonclass="btn btn-primary"data-toggle=&...

2019-06-01 17:53:30 1247 0

原创 Bootstrap3 按钮状态提示

按钮 Bootstrap中的按钮插件(button.js)被赋予多种功能,如为工具条之类的组件赋予状态提示功能、状态切换功能、或者按钮组的功能。 在页面多次加载之间,Firefox 仍然保持表单控件的状态(禁用状态和选择状态)。一个解决办法是为按钮设置 autocomplete="o...

2019-06-01 17:52:41 370 0

原创 Bootstrap3 警告框插件的事件

警告框插件的事件 警告框有两个可以被监听的事件。见表 4‑8。 表 4‑8 警告框的事件及含义 事件 含义 close.bs.alert close方法被调用后,立即触发该事件 closed.bs.alert 当警告框已经被关闭(会等待过渡效果执行结束)之后,触发该...

2019-05-31 16:21:41 135 0

原创 Bootstrap3 警告框插件的使用方法

警告框 警告框插件(alert.js)仅仅为警告框组件一个关闭功能,即点击警告框的关闭按钮,可以让警告框消失,并将它从 DOM 中删除。 使用方法 为警告框添加一个可选的.alert-dismissible类和一个关闭按钮,就可以为警告框组件提供关闭功能。关闭按钮可以使用.close的任何元...

2019-05-31 16:21:00 624 0

原创 Bootstrap3 弹出提示插件的方法

弹出提示插件的方法 1、.popover (options) 使用一个可选的对象参数 options调用某个页面元素的弹出提示。如: $('#element').popover({ placement:right }) 2、.popover('sh...

2019-05-30 21:21:42 232 0

原创 Bootstrap3 弹出提示插件的选项

弹出提示插件的选项 Bootstrap为工具提示插件提供了 11 个选项,所有的选项都可以通过 data 属性或JavaScript进行设置。这些选项详细见表 4‑7: 表 4‑7 popover插件的选项 名称 类型 默认值 说明 animation boole...

2019-05-30 21:14:08 197 0

原创 Bootstrap3 弹出提示插件的使用方法

弹出提示 弹出提示(popover.js)是工具提示的子类,它比工具提示多了一个 content 参数,是工具提示插件的拓展。 弹出框依赖于工具提示插件tooltip.js,如果你定制了 Bootstrap,就一定要将依赖的插件编译进去。 使用方法 你可以给任何元素添加弹出提示,并通过 t...

2019-05-30 21:13:19 370 0

原创 Bootstrap3 工具提示插件的事件

工具提示插件的事件 Bootstrap为工具提示插件提供了 5 个事件,通过监听这些事件,可以对特定操作阶段的用户行为作出响应。这些事件及含义见表 4‑6。 表 4‑6 tooltip插件的事件及含义 事件 含义 show.bs.tooltip show方法调用之后,立即触发...

2019-05-29 14:46:42 125 0

原创 Bootstrap3 工具提示插件的方法

工具提示插件的方法 1、.tooltip(options) 使用一个可选的对象参数 options调用某个页面元素的工具提示。如: $('#element').tooltip({ placement:right }) 2、.tooltip('sho...

2019-05-29 14:45:59 98 0

原创 Bootstrap3 工具提示插件的选项

工具提示插件的选项 Bootstrap为工具提示插件提供了 10 个选项,所有的选项都可以通过 data 属性或JavaScript进行设置。这些选项详细见表 4‑5: 表 4‑5 tooltip插件的选项 名称 类型 默认值 说明 animation boole...

2019-05-29 14:45:16 73 0

原创 Bootstrap3 工具提示插件的使用方法

工具提示 当鼠标移动到特定元素上时,显示相关的提示信息,比如给出链接说明或缩写词的全称等,是一个非常人性化的功能。 HTML本身就支持这样的功能,只需给任何元素添加 title 属性,当鼠标悬停时,浏览器就会将 title 属性的值作为提示信息显示出来。 由于原生的工具提示样式单调、功能单一...

2019-05-29 14:44:33 252 0

原创 Bootstrap3 滚动监听插件的事件

滚动监听插件的事件 Bootstrap为滚动监听插件提供了一个事件 activate.bs.scrollspy,每当一个新的导航项目被激活时,就会触发该事件,并自动为导航条的相应菜单项添加了一个 .active 类,让它高亮显示。 你可以通过JavaScript监听activate.bs.sc...

2019-05-28 17:25:47 240 0

原创 Bootstrap3 滚动监听插件的方法

滚动监听插件的方法 通过 JavaScript 调用滚动监控插件时,如果监听对象的DOM节点有增删元素的操作,则需要调用 .scrollspy('refresh') 方法来更新DOM。 <script> $('[data-spy="...

2019-05-28 17:25:09 111 0

原创 Bootstrap3 滚动监听插件的选项

滚动监听插件的选项 Bootstrap为滚动监听插件提供了一个选项 offset,用来调整滚动位置距顶部偏移的像素值,取值为数字,默认值为10。正值表示滚动条向上偏移,负值表示向下偏移。 offset选项可以通过 data 属性或JavaScript进行设置。如果使用data属性,则要将选项名...

2019-05-28 17:24:31 156 0

原创 Bootstrap3 滚动监听插件的调用方式

滚动监听插件的调用方式 无论何种实现方式,滚动监听都需要被监听的组件是position: relative;即相对定位方式。大多数时候是监听<body>元素。 1、data属性调用 只需给你想监听的元素定义 data-spy="scroll" 属性和 data...

2019-05-28 17:23:54 76 0

提示
确定要删除当前文章?
取消 删除