bootstrap提供倆種布局方式
固定(網格)布局和流式(網格)布局。結合上篇文章所討論的柵格系統來說，
bootstrap的布局實際上是在柵格外加個容器(
container
)。固定布局加的是固定寬度(width)的容器，流式布局加的是自適應(或叫可變)寬度的容器，這是二者的唯一區別。
1.固定布局
下面來看個示例：
span4
span8
span4
span6
span2
">就是上面所說的容器，其內有倆行柵格(.row)。
bootstrap中規定固定容器的總的寬度為940px，具體看下原始碼定義，如下：
.container,
.container（這裡有個技巧，為了讓div在各種瀏覽器下下產生同樣的居中效果將margin-left和margin-right的值為auto是最簡單的方式。*zoom這個css hack是為了相容ie6和7，但具體為什麼要使用zoom=1還不得而知。）
同時，還使用了css偽元素選擇器，在這個類裡面還清空了前後的內容，並且在後面還清除了浮動：
.container:before,
.container:after
.container:after
注：文字中談的數字（比如container的寬度為940px，每個span的寬度都是預設值，實際開發中我們可以適當重寫。）
2.流式布局
也是先看個示例：
...
... ...
...
>是流式布局的容器，其內有倆行流式柵格。其實並非一定要固定容器中只能配固定式柵格，流式容器只能配流式柵格，視需要而定。
原始碼如下：
.container-fluid.container-fluid:before,
.container-fluid:after
.container-fluid:after
3.布局的巢狀
布局的巢狀實際就是柵格的巢狀。如下：
巢狀的頂級
巢狀的2級
巢狀的2級
bootstrap的布局其實就是 容器 + 柵格系統，容器只是限制外圍的寬度，主要變化在於柵格，通過柵格的合併、偏移、巢狀 來最終達到布局效果的。
**：
Bootstrap柵格布局
bootstrap 提供了一套響應式 移動裝置優先的流式柵格系統，隨著螢幕或視口 viewport 尺寸的增加，系統會自動分為最多12列。它包含了易於使用的預定義類，還有強大的mixin 用於生成更具語義的布局。柵格系統用於通過一系列的行 row 與列 column 的組合來建立頁面布局，你的內容就...
Bootstrap柵欄布局
bootstrap柵格布局 bootstrap柵欄系統css中的col xs col sm col md col lg 的意義 小於 768px 的時候，用 col xs 12 類對應的樣式 在 768px 到 992px 之間的時候，用 col sm 9 類對應的樣式 在 992px 到 1200...
Bootstrap柵格布局
1 柵格系統 布局 bootstrap內建了一套響應式 移動裝置優先的流式柵格系統，隨著螢幕裝置或視口 viewport 尺寸的增加，系統會自動分為最多12列。我在這裡是把bootstrap中的柵格系統叫做布局。它就是通過一系列的行 row 與列 column 的組合建立頁面布局，然後你的內容就可以...