请简述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插件主要用来帮助开发者实现与用户交互的功能
请书写栅格系统的基本结构。
<div class="container">
<div class="row">
<div class="col-*-*"></div>
<div class="col-*-*"></div>
</div>
<div class="row"></div>
</div>
列偏移和列排序都可以改变一个列的位置,请问它们的原理分别是什么?产生的效果有什么区别?
- 列偏移实现原理是设置了margin-left属性
- 列排序主要是通过对列设置相对定位的left和right值来实现。
- 列偏移不会改变元素的代码顺序,而列排序可以改变元素的代码顺序。
Bootstrap模态框提供了哪几个JavaScript事件?
- show.bs.modal 显示时触发
- shown.bs.modal 显示完毕后触发
- hide.bs.modal 隐藏式触发
- hidden.bs.modal 隐藏完毕后触发
Bootstrap插件中的事件,需要通过什么方式添加对应的节点上?
- 通过给触发元素添加data-toggle属性的方式。