Bootstrap提供了一套響應式、移動裝置優先的流式柵格系統來進行頁面佈局。
柵格系統用於透過一系列的行（row）與列（column）的組合來建立頁面佈局，你的內容就可以放入這些建立好的佈局中。下面就介紹一下 Bootstrap 柵格系統的工作原理：
“行（row）”必須包含在 .container （固定寬度）或 .container-fluid （100% 寬度）中，以便為其賦予合適的排列（aligment）和內補（padding）。
透過“行（row）”在水平方向建立一組“列（column）”。
你的內容應當放置於“列（column）”內，並且，只有“列（column）”可以作為行（row）”的直接子元素。
類似 .row 和 .col-xs-4 這種預定義的類，可以用來快速建立柵格佈局。Bootstrap 原始碼中定義的 mixin 也可以用來建立語義化的佈局。
透過為“列（column）”設定 padding 屬性，從而建立列與列之間的間隔（gutter）。透過為 .row 元素設定負值 margin 從而抵消掉為 .container 元素設定的 padding，也就間接為“行（row）”所包含的“列（column）”抵消掉了padding。
負值的 margin就是下面的示例為什麼是向外突出的原因。在柵格列中的內容排成一行。
柵格系統中的列是透過指定1到12的值來表示其跨越的範圍。例如，三個等寬的列可以使用三個 .col-xs-4 來建立。
如果一“行（row）”中包含了的“列（column）”大於 12，多餘的“列（column）”所在的元素將被作為一個整體另起一行排列。
柵格類適用於與螢幕寬度大於或等於分界點大小的裝置 ， 並且針對小螢幕裝置覆蓋柵格類。 因此，在元素上應用任何 .col-md-*柵格類適用於與螢幕寬度大於或等於分界點大小的裝置 ， 並且針對小螢幕裝置覆蓋柵格類。 因此，在元素上應用任何 .col-lg-*不存在， 也影響大螢幕裝置。
<div>
<div>.col-md-6</div>
</div>
以上就是一個左右 佈局。
Bootstrap提供了一套響應式、移動裝置優先的流式柵格系統來進行頁面佈局。
柵格系統用於透過一系列的行（row）與列（column）的組合來建立頁面佈局，你的內容就可以放入這些建立好的佈局中。下面就介紹一下 Bootstrap 柵格系統的工作原理：
“行（row）”必須包含在 .container （固定寬度）或 .container-fluid （100% 寬度）中，以便為其賦予合適的排列（aligment）和內補（padding）。
透過“行（row）”在水平方向建立一組“列（column）”。
你的內容應當放置於“列（column）”內，並且，只有“列（column）”可以作為行（row）”的直接子元素。
類似 .row 和 .col-xs-4 這種預定義的類，可以用來快速建立柵格佈局。Bootstrap 原始碼中定義的 mixin 也可以用來建立語義化的佈局。
透過為“列（column）”設定 padding 屬性，從而建立列與列之間的間隔（gutter）。透過為 .row 元素設定負值 margin 從而抵消掉為 .container 元素設定的 padding，也就間接為“行（row）”所包含的“列（column）”抵消掉了padding。
負值的 margin就是下面的示例為什麼是向外突出的原因。在柵格列中的內容排成一行。
柵格系統中的列是透過指定1到12的值來表示其跨越的範圍。例如，三個等寬的列可以使用三個 .col-xs-4 來建立。
如果一“行（row）”中包含了的“列（column）”大於 12，多餘的“列（column）”所在的元素將被作為一個整體另起一行排列。
柵格類適用於與螢幕寬度大於或等於分界點大小的裝置 ， 並且針對小螢幕裝置覆蓋柵格類。 因此，在元素上應用任何 .col-md-*柵格類適用於與螢幕寬度大於或等於分界點大小的裝置 ， 並且針對小螢幕裝置覆蓋柵格類。 因此，在元素上應用任何 .col-lg-*不存在， 也影響大螢幕裝置。
<div>
<div>.col-md-6</div>
<div>.col-md-6</div>
</div>
以上就是一個左右 佈局。