Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web。
Bootstrap 与 jQuery UI 类似，也是一个 web 前端框架，但是他两没有任何关系，只不过都依赖于 jQuery 核心库。
jQuery UI 框架确切地说，只包含了一堆零散的 UI 控件供你使用，它并没有从web建站的角度提供更进一步的帮助。
比如，web 建站时，需要设计网站LOGO，顶层导航栏，面包屑导航栏，内容分为几列几行，版权页脚等以及位置布局。
而 Bootstrap 框架，除了包含了一堆 UI 控件，还从 web 建站的角度提为你供了一些相应的 UI 控件，免除你自己再行设计。
同时，你也可以根据自己的要求，自行修改 Bootstrap 提供的默认样式。
Bootstrap 的官网提供了非常好的学习示例，非常容易学习，其中介绍了框架的 Grid 划分，CSS 属性介绍，JS的方法介绍。
我个人感觉，学习一个新的前端框架，有时候，直接看官网，可能一头雾水，不知道从哪儿下手？
那么，这时候可先简略参考下相应的编程书籍，了解下大概，千万不要花费大力气一页一页看，
由于前端框架变化实在太快了，版本之间的差异，有时候，是天翻地覆的，比如 AngularJS 1 和 AngularJS 2，
再比如 Bootstrap 3 与 Bootstrap 2，而编程书籍的知识点都比较陈旧，所以，要把主要的经历放到官网上的例子上，
学习的时候，把其中的例子代码 copy 出来运行下，手动修改下各种参数，看看效果。
一般情况下，官网都提供了最新版本的代码示例，以下是 Bootstrap 的官网，http://getbootstrap.com/
Bootstrap 4 已经有 alpha 版本放出来了，赶脚真快......，学习永不止步 〉〉〉
Grid 列的单位
xs (phones)
sm (tablets)
md (desktops)
lg (larger desktops)
<div class="container"> <div class="row"> <div class="col-xs-4">.col-xs-4</div> <div class="col-xs-4">.col-xs-4</div> <div class="col-xs-4">.col-xs-4</div> </div> <div class="row"> <div class="col-sm-4">.col-sm-4</div> <div class="col-sm-4">.col-sm-4</div> <div class="col-sm-4">.col-sm-4</div> </div> <div class="row"> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> </div> <div class="row"> <div class="col-lg-4">.col-lg-4</div> <div class="col-lg-4">.col-lg-4</div> <div class="col-lg-4">.col-lg-4</div> </div> <div class="row"> <div class="col-xl-4">.col-xl-4</div> <div class="col-xl-4">.col-xl-4</div> <div class="col-xl-4">.col-xl-4</div> </div> </div>