Bootstrap总结

什么是bootstrap？

Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目。
特点就是灵活简洁，代码优雅，美观大方；
其目的是为了让Web开发更敏捷；
是Twitter公司的两名前端工程师Mark Otto和Jacob Thornton在2011年发起的，并利用业余时间完成第一个版本的开发；

为什么要用bootstrap?

生态圈火，不断地更新迭代；
提供一套美观大方地界面组件；
提供一套优雅的HTML+CSS编码规范；
让我们的 Web 开发更简单，更快捷；

bootstrap能帮我们解决什么问题？

响应式布局
提供了一套风格统一的界面组件
减轻维护成本（统一了代码风格）
目录结构
|——css // 自己定义的css文件
|——js // 自己写的js文件
|——font // 自己制作的字体文件
|——img // 项目中用到的图片目录
|——lib // 引入的第三方代码
index.html // 入口文件

编码约定

html
在head中引入必要的CSS文件，优先引用第三方的CSS，方便我们自己的样式覆盖。
在body末尾引入必要的JS文件，优先引用第三方的JS，注意JS文件之间的依赖关系，比如bootstrap.js依赖jQuery，那就应该先引用jquery.js 然后引用bootstrap.js。
css
除了公共级别样式，其余样式全部加上作用域。避免出现样式冲突的问题。
尽量使用 直接子代选择器， 少用间接子代 避免错杀。
我们约定所有的分割线使用下边框的方式实现。

栅格系统
栅格系统是什么？

Bootstrap 提供了一套响应式、移动设备优先的流式栅格系统，随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列。

栅格系统解决什么问题？

栅格