6. Bootstrap框架

请简述Bootstrap的主要特色和缺点。

主要特色

• 移动设备优先
• 浏览器支持
• 容易上手
• 支持式响应式设计
• 开源代码
• 支持HTML5和CSS3
• 优秀的开发及维护团队
• 样式化的开发文档

缺点

• Bootstrap 内置了很多的样式，这些样式组成了Bootstrap的设计风格，使用Bootstrap搭建的页面风格都比较相似。在Bootstrap的结构化环境中，与众不同的创新设计很难实现，容易造成用户的审美疲劳。
• 开发离不开手册，Bootstrap 中各种功能和布局都有固定的代码结构和class名，开发中这些固定的代码结构和class名很难被记忆并熟练使用，在开发中不得不始终翻阅手册。
• 代码语义性差， 使用Bootstrap框架后的HTML代码将会出现大量的class类名，这可能导致class命名冲突，并且大篇幅的class类名让HTML内容和表现耦合严重，与HTML5推崇的内容与表现相剥离的理念相矛盾。
• 对低版本的 lE浏览器不兼容。

请简述Bootstrap的主要功能和构成模块。

主要功能

• 栅格系统
• 排版
• 表单
• 导航
• 图片

构成模块

• CSS样式
  Bootstrap 自带以下特性：全局的 CSS 设置、定义基本的 HTML 元素样式、可扩展的 class，以及一个先进的栅格系统。
• 基本组件
  例如，网站导航、标签页、工具条、面包屑、分页栏、提示标签、产品展示、提示信息块和进度条等。
• JavaScript 插件
  Bootstrap 包含了十几个自定义的 jQuery 插件，这些jQuery插件主要用来帮助开发者实现与用户交互的功能

请书写栅格系统的基本结构。

列偏移和列排序都可以改变一个列的位置，请问它们的原理分别是什么？产生的效果有什么区别？

• 列偏移实现原理是设置了margin-left属性
• 列排序主要是通过对列设置相对定位的left和right值来实现。
• 列偏移不会改变元素的代码顺序，而列排序可以改变元素的代码顺序。

Bootstrap模态框提供了哪几个JavaScript事件？

• show.bs.modal 显示时触发
• shown.bs.modal 显示完毕后触发
• hide.bs.modal 隐藏式触发
• hidden.bs.modal 隐藏完毕后触发

Bootstrap插件中的事件，需要通过什么方式添加对应的节点上？

• 通过给触发元素添加data-toggle属性的方式。