Bootstrap是一组用于网站和网络应用程序开发的开源前端（所谓“前端”，指的是展现给最终用户的界面。与之对应的“后端”是在服务器上面运行的代码）框架，包括HTML、CSS及JavaScript的框架，提供字体排印、窗体、按钮、导航及其他各种组件及Javascript扩展，旨在使动态网页和Web应用的开发更加容易。
Bootstrap响应式设计
使用Bootstrap前端框架进行响应式色剂，集中创建页面的图片排版大小，可以智能地根据用户行为以及使用的设备环境（系统平台、屏幕尺寸、屏幕定向等）进行相对应的布局。（使网页在各种尺寸的终端上均可以较好地显示，无需根据屏幕尺寸再做适配。）
- 使用Bootstrap框架，仅需将：
<link rel = "stylesheet" href = "//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"/>
添加到html文件开头中。
container-fluid自适应布局
采用Bootstrap前端框架，需要将所有的HTML内容放在属性class = "container-fluid"的div标签内，表示网页内容采用自适应布局。图片自适应
在手机页面中插入一张图片，图片的大小可能超过屏幕的尺寸，只需要在img标签中加入class = img-responsive属性即可解决。
注：根据屏幕的尺寸来调整图片的宽度，图片的长度依据图片的长、宽比例自动调整，得到最佳的显示效果。标题居中
在h标签中加入class = "text-center"属性即可。Bootstrap风格的按钮
通过btn属性，美化按钮。
<button class = "btn">Like</button>
通常情况下，button元素仅与所包含的文本同宽。通过使其成为块级元素，按钮将会延展，填满页面整个水平空间。其后的所有元素均在区块的下一行。
使用btn-block属性实现。
<button class = "btn btn-block">Like</button>
- 按钮的颜色
深蓝色：btn-primary属性，应用的主要颜色，用于用户主要采取的操作；
浅蓝色：btn-info属性，用户可能采取的操作；
红色：btn-danger属性，可能具有破坏性的操作，如删除。<button class = "btn btn-info">Like</button>
- 行内布局
Bootstrap将多个元素置于一行，并且制定各个元素的宽度。借助`div`标签实现，Bootstrap中多数`class`属性均可以放入`div`标签中。
```html
<div class = "row">
<div class = "col-xs-2"><button>Like</button></div>
<div class = "col-xs-2"><button>Hate</button></div>
<div class = "col-xs-2"><button>Bullshit</button></div>
</div>
注：
col：列；xs：extra-samll（适用于小屏）；md：medium（中等的）*：表示一个数字，代表一行中各个元素的宽度。
- 行内元素
<span>...</span>
通过span标签可以为一个元素的不同部分分别制定样式。
