BootStrap页面

1. 下载Bootstrap
2. 在项目中将这三个文件夹复制
3. 创建html页面，引入必要的资源文件
   4.jquery-3.2.1.min

响应式布局
* 同一套页面可以兼容不同分辨率的设备。
* 实现：依赖于栅格系统：将一行平均分成12个格子
*步骤：
1. 定义容器。相当于之前的table、
* 容器分类：1. container：两边留白 2. container-fluid：每一种设备都是100%宽度
2. 定义行。相当于之前的tr 样式：row
3. 定义元素。指定该元素在不同的设备上，所占的格子数目。样式：col-设备代号-格子数目

CSS样式和JS插件

1. 全局CSS样式：
   * 按钮：class=“btn btn-default”
   * 图片：* class=“img-responsive”：图片在任意尺寸都占100%
   * 图片形状
   * table
   * table-bordered
   * table-hover
   * 表单
   * 给表单项添加：class=“form-control”
   2. 组件：
      • 导航条
      • 分页条
   3. 插件：
      • 轮播图

页面创建过程

< !–1.页眉部分–>
< header class =“container-fluid”>< /header>
< !–2.主体部分–>
< div class=“container”>< /div>
< !–3.页脚部分–>
< footer class=“container-fluid”>< /footer>