响应式网页指的是可以在不同尺寸/分辨率设备下都可以运行良好的网页，本篇就来讲解下如何使用Bootstrap构建符合标准规范的响应式网页。
2. 创建标准HTML5页面首先创建一个标准的HTML5网页，代码如下：
boostrap-responsive
注意其中是为了告诉浏览器，当前文档是HTML5文档。
告诉IE浏览器，以尽可能高的仿真版本显示当前网页。所谓仿真版本，指的是IE浏览器可以仿照运行的其他版本的IE，如下图：
改行代码则指示了页面的初始宽度为设备宽度，初始缩放比例为100%，这样的话能支持网页在屏幕较小但DPI较高的设备(例如iPhone)上正确显示。
首先添加对Bootstrap支持。
boostrap-responsive
注意Bootstrap对响应式的支持，是通过控制网格列在不同容器宽度下占据不同的列数来实现的。
当浏览器容器宽度小于768像素时，Bootstrap会采用.col-xs-开头的列。
当浏览器容器宽度处于[768,992)是，将采用.col-sm-开头的列。
当浏览器容器宽度处于[992,1200)是，将采用.col-md-开头的列。
当浏览器容器宽度大于1200是，将采用.col-lg-开头的列。
注意上面四个宽度尺寸，实际上对应的是手机、平板、小型PC显示器、大型PC显示器，但是随着显示设备的发展，目前这样的预设已经不再精准，需要根据实际情况来具体设置。
好的，有了上面的理论基础，我们来实现一个可以同时支持电脑显示器和手机显示器的网页，代码如下：
按照上面的设置，当屏幕尺寸较大时，会采用.col-md-3的列显示方式，所以每个图片会占据3/12容器宽度，效果如下：
而当屏幕尺寸较小时，会采用.col-sm-12的列显示方式，所以每个图片会占据12/12，即全部的容器宽度，效果如下：
Bootstrap实现响应式网页的方式十分简洁优雅，用同一套代码，就能支持各类不同分辨率的设备，优秀！
