什么是 Bootstrap？
Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的。
历史
Bootstrap 是由 Twitter 的 Mark otto 和 Jacob Thornton 开发的。Bootstrap 是 2011 年八月在 GitHub 上发布的开源产品。
本文重点给大家介绍Bootstrap零基础入门教程(二)，具体详情如下所示：
过程中会频繁查阅资料的网站：
这是W3C联盟为了传播W3C标准而建立的网站，有很多关于Web端的技术，你可以将其看作为一部Web技术的百科全书。
闲话不多说，让我们开始：
（1） 明确实现目标
如下图所示，这就是咱们要实现的一个简单网站。布局简单，也没有很炫的效果。但是要实现一个功能：从Json文件（关于Json的知识可以到上述网站去查）里读取相关信息，显示在网站上。
Json文件内容：
即：
布局：
为三大块：第一行左边为班级列表，第一行右边为同学姓名列表，第二行为同学相关信息。
功能：
1.点击班级列表中的某一个班级，可以动态地在同学列表中更新这个班级中有哪些同学，并且可以实现班级的复选。
2.点击同学列表中的某一个同学，动态的在第二行显示该同学的信息，每次只能显示一个同学的信息。
（2）分析需要用到的技术
布局：
BootStrap：用来实现这种简单的两行布局，以及Class列的复选，以及滚动条（有些直接用BootStrap很好实现，有些则不能。如何知道？去上述三个网站里去找，去查）
功能：
用Javascript和Ajax来实现数据的获取和动态的交互(以局部刷新的方式)。
（3）技术选型分析
1. 实现布局。
通过查阅文档（），我发现了Bootstrap是用栅格系统布局的，通过给div 设置特定的class属性可以实现我想要的布局效果。并且可以给手机、平板、台式电脑设置不一样的效果。关于HTML标签的class属性，以及什么是HTML标签可以在W3SCHOOL上查到。
值得注意的一点是：元素的class属性可以有多个。
Eg:
不同属性之间用“空格”间隔，相信我 ，这样能让你写Javacript脚本和调整CSS时游刃有余。
2.实现Class编号垂直排列以及多选。
查阅知道了如何设置垂直的按钮组。即将按钮组所在的DIV的class设置为btn-group-vertical，使之成为存放按钮组的容器。
查阅知道了如何让按钮组实现复选。通过向class属性为 btn-group的DIV 添加 data 属性 data-toggle="buttons" 来实现。
3.实现按钮边角由圆角重新定义为直角，给按钮组加滚动条，以及给按钮上显示的文字加上限制，使其不超出按钮，超出的部分以”…”显示，并且当鼠标移动停在按钮上的时候，显示全部文字：
少部分（圆角变直角，鼠标悬停显示文字）需要直接在HTML标签里设置style和title属性。
大部分的实现，是写了个CSS：
rush:js;">
Click classmate to show details.
不同属性之间用“空格”间隔，相信我 ，这样能让你写Javacript脚本和调整CSS时游刃有余。
2.实现Class编号垂直排列以及多选。
查阅知道了如何设置垂直的按钮组。即将按钮组所在的DIV的class设置为btn-group-vertical，使之成为存放按钮组的容器。
查阅知道了如何让按钮组实现复选。通过向class属性为 btn-group的DIV 添加 data 属性 data-toggle="buttons" 来实现。
3.实现按钮边角由圆角重新定义为直角，给按钮组加滚动条，以及给按钮上显示的文字加上限制，使其不超出按钮，超出的部分以”…”显示，并且当鼠标移动停在按钮上的时候，显示全部文字：
少部分（圆角变直角，鼠标悬停显示文字）需要直接在HTML标签里设置style和title属性。
大部分的实现，是写了个CSS：