随笔分类 - Bootstrap历练讲解
目前最受欢迎的前端框架
摘要：语法1、用两个空格来代替制表符(Tab)--这是唯一能保证在所有的环境下获得一致展现的方法。2、嵌套元素应当缩进一次(即两个空格)。3、对于属性的定义，属性值确保全部都用双引(避免使用单引号)。4、不要在自动闭合元素后面加上斜线--HTML5规范中明确说明这是可选的。5、不要省略可选的结束标签。实例...
阅读全文
摘要：1、添加.navbar-fixed-top类可以让导航条固定的页面的顶部，固定的导航条会遮住页面上其它的内容，除非给body元素设置padding,导航条默认高度为50px ,因此可以给body元素设置body{padding-top:70px}2、导航条是在应用或网站中作为导航页头的响应式基础组件...
阅读全文
摘要：解析html5shiv主要解决HTML5提出的新的元素不被IE6-8识别，这些新元素不能作为父节点包裹子元素，并且不能应用CSS样式。让CSS 样式应用在未知元素上只需执行 document.createElement(elementName) 即可实现。html5shiv就是根据这个原理创建的。
阅读全文
摘要：bootstrap 附加导航(Affix)插件允许某个div元素固定到页面中的某个位置。您可以打开或关闭使用该插件之间进行切换后续再写
阅读全文
摘要：事件下表列出了轮播（Carousel）插件中要用到的事件。这些事件可在函数中当钩子使用。事件描述实例slide.bs.carousel当调用 slide 实例方法时立即触发该事件。$('#identifier').on('slide.bs.carousel', function () { // 执...
阅读全文
摘要：方法下面是一些轮播（Carousel）插件中有用的方法：方法描述实例.carousel(options)初始化轮播为可选的 options 对象，并开始循环项目。$('#identifier').carousel({ interval: 2000}).carousel('cycle')从左到右循环...
阅读全文
摘要：轮播插件是一种灵活的响应式的向站点添加滑块的方式。除此之外，内容也是非常灵活的。可是图像，内嵌框架，视频或者其它您想的放置任何内容的类型。下面是一个简单的幻灯片，使用轮播(carousel)插件显示一个循环播放元素的通用组件，为了现实轮播，您只需要添加带有标签的代码即可。实例： ...
阅读全文
摘要：事件下表列出了折叠（Collapse）插件中要用到的事件。这些事件可在函数中当钩子使用。事件描述实例show.bs.collapse在调用 show 方法后触发该事件。$('#identifier').on('show.bs.collapse', function () { // 执行一些动作.....
阅读全文
摘要：方法下面是一些折叠（Collapse）插件中有用的方法：方法描述实例Options:.collapse(options)激活内容为可折叠元素。接受一个可选的 options 对象。$('#identifier').collapse({ toggle: false})Toggle:.collapse...
阅读全文
摘要：折叠插件(collapse)可以很容易地让页面区域折叠起来， 无论您是用它来创建折叠导航还是内容面板，它都允许很多内容选项。您可以使用折叠插件1、创建可折叠的分组或折叠的面板 Bootstrap历练实例：折叠插件(collapse)面板 ...
阅读全文
摘要：复选框（Checkbox）您可以创建复选框按钮组，并通过向btn-group添加 data 属性data-toggle="buttons"来添加复选框按钮组的切换。 Bootstrap 历练实例 - 按钮（Button）插件复选框 ...
阅读全文
摘要：单个切换如需激活单个按钮的切换（即改变按钮的正常状态为按压状态，反之亦然），只需向 button 元素添加data-toggle="button"作为其属性即可，如下面实例所示： Bootstrap历练实例：按钮(Button)插件单个切换 ...
阅读全文
摘要：通过按钮(Button)插件,您可以添加进一些交互、比如控制按钮的状态、或者为其它组件(工具栏)创建按钮组。加载状态如需向按钮添加加载状态，只需要简单地向 button 元素添加data-loading-text="Loading..."作为其属性即可，如下面实例所示： Bootstrap历练...
阅读全文
摘要：事件下表列出了警告框（Alert）插件中要用到的事件。这些事件可在函数中当钩子使用。事件描述实例close.bs.alert当调用close实例方法时立即触发该事件。$('#myalert').bind('close.bs.alert', function () { // 执行一些动作...})c...
阅读全文
摘要：警告消息大多来是用来向终端用户提示警告或确认的消息，使用警告框插件，您可以向所有的警告框消息添加取消功能。用法您有以下两种方式启用警告框的可取消功能。1、通过data属性：通过数据添加可取消功能(data api),只需要要向关闭按钮添加data-dismissal="alert"，就会自动为警告框...
阅读全文
摘要：事件下表列出了弹出框（Popover）插件中要用到的事件。这些事件可在函数中当钩子使用。事件描述实例show.bs.popover当调用 show 实例方法时立即触发该事件。$('#mypopover').on('show.bs.popover', function () { // 执行一些动作....
阅读全文
摘要：方法下面是一些弹出框（Popover）插件中有用的方法：方法描述实例Options:.popover(options)向元素集合附加弹出框句柄。$().popover(options)Toggle:.popover('toggle')切换显示/隐藏元素的弹出框。$('#element').popov...
阅读全文
摘要：Bootstrap 弹出框(Popover)插件与Bootstrap 提示工具(Tooltip)插件类似，提供了一个扩展的视图，用户只需要把鼠标指针悬停到元素上面即可。弹出框的内容完全由Bootstrap Data API来填充。用法弹出框插件根据需要生成内容或标记，默认情况下把弹出框(Popove...
阅读全文
摘要：事件下表列出了提示工具（Tooltip）插件中要用到的事件。这些事件可在函数中当钩子使用。事件描述实例show.bs.tooltip当调用 show 实例方法时立即触发该事件。$('#myTooltip').on('show.bs.tooltip', function () { // 执行一些动作...
阅读全文
摘要：方法下面是一些提示工具（Tooltip）插件中有用的方法：方法描述实例Options:.tooltip(options)向元素集合附加提示工具句柄。$().tooltip(options)Toggle:.tooltip('toggle')切换显示/隐藏元素的提示工具。$('#element').to...
阅读全文