• 12柵格系統——就是將屏幕平分12份（列）。使用行(row)來組織元素（每一行都包括12個列），然後將內容放在列內。通過col-md-offset-*來控制列偏移。
• 基礎布局組件——Bootstrap提供了多種基礎布局組件。如排版、代碼、表格、按鈕、表單等。
• Jquery——Bootstrap所有的JavaScript插件都依賴於Jquery的。如果要使用這些JS插件，就必須引用Jquery庫。這也是為什麽我們在除了要引用Bootstrap的JS文件和CSS文件外，還需要引用Jquery庫的原因，兩者是依賴關系。
• CSS組件——Bootstrap為我們預實現了很多CSS組件。如下拉框、按鈕組、導航等。也就是說Bootstrap內容幫我們定義好了很多CSS樣式，你可以將這些樣式直接應用到之前的下拉框等元素裏。
• JavaScript插件——Bootstrap也為我們實現了一些JS插件，我們可以用其提供的插件要完成一些常用功能，而不需要我們再重新寫JS代碼來實現像提示框，模態窗口這樣的效果了。
• 響應式設計——這就是一個設計理念。響應式的意思就是它會根據屏幕尺寸來自動調整頁面，使得前端頁面在不同尺寸的屏幕上都可以表現很好。

　　Bootstrap就是由上面幾部分組成的。上面已經都每個組成部分做了一個簡單的介紹，接下來的內容無非是通過一些實例來對每個組成部分進行一個詳細的介紹罷了。

Bootstrap定義12柵格系統，就是為了更好的布局。每個前端框架都首先要定義好的就是布局系統。在Bootstrap裏面，就是利用行和列來創建頁面布局的。其布局有幾個原則：

• 行（row）必須包含在.container(固定寬度)或.container-fluid(100%寬度)中
• 每行都包含12列
• 將內容放置在每列中　

　　在bootstrap的柵格系統中，根據寬度將瀏覽器分為4種。其值分別是：自動（100%）、750px、970px、 1170px。

　　對應的樣式為超小（xs）、小型（sm）、中型屏幕 （md）、大型 （lg）

　　其本就是通過媒體查詢定義最小寬度實現。所以，Bootstrap做出來的網頁向大兼容，向小不兼容！

　　在Bootstrap框架內，已預先定義好了屏幕大小的分界值，其分界值得定義就是通過媒體查詢來定義的。

Bootstrap其實只不過是一個樣式框架罷了。利用它我們可以快速方便地構建Web頁面。

Bootstrap 整體架構