BootStrap ：环境搭建；布局容器；视口：在移动设备上使用，用于比例缩小视口内容；栅格系统；Col-屏幕尺寸-所占栅格数

1  BootStrap ：环境搭建，需要css fonts js和jquery

都分为完整版和压缩版，完整版和压缩版的内容和功能没有区别，完整版利于学习，压缩版适合网络传输。

视口：在移动设备上使用，用于比例缩小视口内容

Width=device-width  设置窗口的宽度， device-width  设备宽度（动态的设置）

Initial-scale=1 初始化的缩放设置。  移动设置在打开网页时显示的默认缩放比例。取值为1~5

Minimum-scale=2 移动设备上可以缩小的最小缩放级别

Maximum-scale=5  移动设备上可以放大的最大级别

User-scalable=on  关闭缩放功能。（不能放大缩小）

布局容器：任意元素使用了布局容器的样式，都会成为一个布局容器，建议使用div作为布局容器。

.container   用于固定宽度并支持响应式布局的容器

<div class="container" style="border: 1px solid red;">123</div>

  特点是 宽度没有占据整个窗口，居中两端留白

.container-fluid   用于100%的区域，占用全部的视口（viewport）的容器

<div class="container-fluid" style="border: 1px solid blue;">45678</div>

栅格系统：一行分为12列，通过设定元素占用的列数，布局元素在页面上的展示位置，

  专门用于响应式开发布局的栅格系统。可以让开发人员更加轻松的进行网页布局

栅格特点：基本步骤，先定义容器， 再定义行 再定义列 列里面再写内容。

行 row 必须在.container或者.container-fluid

Col-屏幕尺寸-所占栅格数

列元素的书写顺寻，决定了布局顺序，先写的布局会被先布局到行上。

列元素的占用列数，定义列元素的大小。

行和列可以进行无限嵌套，嵌套方式，必须是 行 下嵌套列 ，列到 行 。行再到列