标签：
（一）安装bootstrap 环境
bootstrap下载地址：http://v3.bootcss.com/getting-started/
（二）引用环境的方式有2种
方式1：在联网的情况下：
1 <!-- 新 Bootstrap 核心 CSS 文件 --> 2 <link href="http://apps.bdimg.com/libs/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet"> 3 <!-- 可选的Bootstrap主题文件（一般不使用） --> 4 <script src="http://apps.bdimg.com/libs/bootstrap/3.3.0/css/bootstrap-theme.min.css"></script> 5 <!-- jQuery文件。务必在bootstrap.min.js 之前引入 --> 6 <script src="http://apps.bdimg.com/libs/jquery/2.0.0/jquery.min.js"></script> 7 <!-- 最新的 Bootstrap 核心 JavaScript 文件 --> 8 <script src="http://apps.bdimg.com/libs/bootstrap/3.3.0/js/bootstrap.min.js"></script>
在连接互联网的情况下，能够保证bootstrap 环境的始终是最新版本的。
方式2：在本地的情况下，推荐使用此种方式
1 <!-- 新 Bootstrap 核心 CSS 文件 --> 2 <link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet"> 3 <!-- 可选的Bootstrap主题文件（一般不使用） --> 4 <script src="/bootstrap/css/bootstrap-theme.min.css"></script> 5 <!-- jQuery文件。务必在bootstrap.min.js 之前引入 --> 6 <script src="/bootstrap/js/jquery.min.js"></script> 7 <!-- 最新的 Bootstrap 核心 JavaScript 文件 --> 8 <script src="/bootstrap/js/bootstrap.min.js"></script>
（一）html5文档类型
1 <!DOCTYPE html> 2 <html lang="zh-CN"> 3 ... 4 </html>
（二）移动设备优先
Bootstrap 3 的设计目标是移动设备优先（如：手机、平板等），然后才是桌面设备（PC机）。
1 <meta name="viewport" content="width=device-width, 2 initial-scale=1.0, 3 maximum-scale=1.0, 4 user-scalable=no">
width 属性控制设备的宽度。 device-width 可以确保它能正确呈现在不同设备上。
initial-scale=1.0 确保网页加载时，以 1:1 的比例呈现，不会有任何的缩放。
在移动设备浏览器上，通过为 viewport meta 标签添加 user-scalable=no 可以禁用其缩放（zooming）功能。
通常情况下，maximum-scale=1.0 与 user-scalable=no 一起使用。这样禁用缩放功能后，用户只能滚动屏幕，就能让您的网站看上去更像原生应用的感觉。注意，这种方式我们并不推荐所有网站使用，还是要看您自己的情况而定！
（三）布局容器
bootstrap框架中所有的网页内容和栅格系统包裹在.container 的容器内
.container 类，用与国定宽度并支持响应式布局的容器。
.container-fluid 类，用于100%宽度，
（一）标题
标题包括：html 中的所有标签。如：<h1></h1> 字体大小
标签：
原文地址：http://www.cnblogs.com/ljty1980/p/5733809.html
