BootStrap是什麼？
Bootstrap，來自 Twitter，是目前很受歡迎的前端框架。Bootstrap 是基於 HTML、CSS、JAVASCRIPT 的，它簡潔靈活，使得 Web 開發更加快捷。它由Twitter的設計師Mark Otto和Jacob Thornton合作開發，是一個CSS/HTML框架。
BootStrap官網中文介紹：http://www.bootcss.com/
BootStrap 的特點
Bootstrap是基於HTML5和CSS3開發的，它在jQuery的基礎上進行了更爲個性化的完善，形成一套自己獨有的網站風格，併兼容大部分jQuery插件。個人理解： 可以使用BootStrap框架開發一個響應式的頁面，可以同時使用與pc端，pad端和手機端，並且不影響瀏覽的效果。
下載BootStrap
去官網下載對應的版本
BootStrap的結構：
1、 全局CSS
*BootStrap定義了一套CSS的樣式表.
2、組件
*BootStrap定義的一套按鈕，導航條...
3、JS插件
*BootStrap定義的一套JS的插件.
BootStrap的入門開發
引入4個外部的文件，先後順序不能反
<meta charset="UTF-8">
<!--BootStrap設計的頁面支持響應式的 -->
<meta name="viewport"content="width=device-width, initial-scale=1">
<title></title>
<!--引入BootStrap的CSS-->
<link rel="stylesheet"href="../../css/bootstrap.css" type="text/css"/>
<!--引入JQuery的JS文件：JQuery的JS文件要在BootStrap的js的文件的前面引入-->
<script type="text/javascript"src="../../js/jquery-1.11.3.min.js" ></script>
<!--引入BootStrap的JS的文件-->
<script type="text/javascript"src="../../js/bootstrap.js" ></script>
【BootStrap佈局容器】
【BootStrap的柵格系統】
響應式的設計：
* CSS3的樣式：媒體查詢（即：根據不同設備的寬度定義了不同的樣式）
柵格樣式：
* 設備的分辨率大於 1200 使用lg樣式
* 設備的分辨率大於 992 < 1200 使用md樣式
* 設備的分辨率大於768 < 992 使用sm樣式
* 設備的分辨率小於 768 使用xs樣式
將一行分成12列.定義div元素 樣式的和加一起等於12 即可.
【BootStrap的全局CSS】
定義了一套CSS
* 對頁面中的元素進行定義:
* 列表元素，表單，按鈕，圖片...
代碼實現：
使用BootStrap佈局網站的首頁：
需求：
使用BootStrap佈局網站的首頁.
步驟分析：
Ø 步驟一：新建一個html頁面.引入bootStrap的相應js和css
Ø 步驟二：定義一個整體的div，將整體的div分成8個部分.
Ø 步驟三：完成每個部分的顯示.
代碼實現: