1.Bootstrap的基本了解：　　

　　Bootstrap，來自 Twitter，是目前最受歡迎的前端框架。Bootstrap 是基於 HTML、CSS、JAVASCRIPT 的，它簡潔靈活，使得 Web 開發更加快捷。——引用自360百科

　　Bootstrap將通過調整HTML元素大小來確定屏幕的寬度和響應，因此名稱響應式設計（Responsive Design）。

　　代碼添加到HTML頂部來將Bootstrap添加到任何應用程序：<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"/>

　　Bootstrap使用響應式網格系統，可以輕松地將元素放入行中並指定每個元素的相對寬度。下面是Bootstrap的12列網格布局如何工作的圖：

　　通過 .row表示行 和 .col-xs-* 這種表示寬度的列快速創建柵格布局：

2.Fluid layout　　

　　流布局是一種適應屏幕的做法。即不固定塊的寬度，而是采用百分比作為單位來確定每一塊的寬度。

　　開始，我們應該將所有的HTML嵌套在一個div元素中，並使用類container-fluid。

3. 圖片：

　　類img-responsive　　img-responsive是圖片響應式的意思，在Bootstrap框架中，有一個.img-responsive的CSS樣式。應用這個樣式以後，圖片就會變成響應式圖片

4.標題

　　類text-center　　實現塊元素居中顯示

　　類text-primary

5.按鈕

　　類btn　　Bootstrap自己的按鈕元素樣式，通常，您的btn類的按鈕元素與其包含的文本一樣寬。

　　類btn-block　　按鈕將伸展到填充您的頁面的整個水平空間，其後的任何元素將流入塊下方的“新行”。

　　類btn-primary　　是您在應用程序中使用的主要顏色。 突出顯示您希望用戶采取的操作。

　　類btn-info　　用於提醒用戶可以采取的可選操作。

　　類btn-danger　　用於通知用戶按鈕執行破壞性操作，例如刪除。

6.圖標：

　　Font Awesome是一個方便的圖標庫。 這些圖標是矢量圖形，以.svg文件格式存儲。 這些圖標就像字體一樣被處理。 您可以使用像素指定其大小，並且它們將假定其父HTML元素的字體大小。

　　i元素最初用於制作其他元素斜體，但現在通常用於圖標。 您將Font Awesome類添加到i元素以將其轉換為圖標，例如：

7.其他：

　　<span> 標簽被用來組合文檔中的行內元素。前後不換行，如下

　　<p>Things cats <span class="text-danger">love:</span></p>　

8.Bootstrap練習

　　　　Bootstrap有一個名為well的類，可以為您的列創建一個視覺深度。

FCC學習記錄（二）—— Responsive Design with Bootsstrap