Bootstrap柵格系統
1.什麼是柵格系統:
在Bootstrap中，它提供了一套響應式、移動設備優先的流式柵格系統，隨着屏幕或視口（viewport）尺寸的增加，系統會自動分爲最多12列。柵格系統用於通過一系列的行(row)與列(column)的組合來創建頁面佈局， 你的內容就可以放入這些創建好的佈局中，Bootstrap 柵格系統的步驟：
(1) "行(row)"必須包含在 .container(固定寬度)或 .container-fluid(100% 窗口寬度)中（附圖）：
(2) 列(column)必須包含在行（row）中
(3) 你所書寫的內容應當放置於"列(column)"內
(4) 如果一"行(row)"中包含了的"列(column)"大於 12，多餘的"列(column)"所在的元素將被作爲一個整體另起一行排列
代碼書寫及結果展示（附圖）：
Chrome上的結果：
正如上圖所示，就是柵格系統的書寫格式，當containr換爲container-fluid時，它的佈局就是這樣的:
這就是container和container-fluid的區別，前者是在屏幕兩邊具有留白，也就是具有固定寬度（這個寬度是跟隨自己屏幕大小默認設定的，也可以自己調）；後者就是自己屏幕視口有多大，它的寬度有多大。
下面就介紹一下上圖中的col-md-是什麼---
2.柵格參數
先附張圖：
通過上圖就能明白這些md，xs是什麼了，也就是寫的col-md-3，col-md-4，col-md-5三個div的內容在分辨率大於992px的時候屏幕中分別佔3/12，4/12，5/12的大小，如果分辨率小於992px的時候，所有div就會自動重新另起一行（如下圖）：
如果想讓所書寫的內容在其他屏幕中不另起一行，只需要在接着寫其他參數就好了（例：class="col-md-3，col-sm-6"就是在中等屏幕中佔3列，在小屏幕中佔6列）
一些柵格系統中的其他屬性：
3.列的偏移
使用 .col-md-offset-* (md也可以爲其他，*爲要偏移的數字)類可以將列向右側偏移
注意:offset只能向右偏移且對後面的列會造成影響（附圖）
代碼：
結果展示：
如圖所示：col-md-5就被擠到下面另起一行了
4.列的隱藏
hidden-xs/sm/md/lg: 可以對所選中的列進行隱藏（附圖）
代碼：
結果：
如圖所示：當屏幕縮小到xs時，col-md-12便被隱藏了
5.列的排序
通過使用 .col-md-push-* 和 .col-md-pull-* 類就可以很容易的改變列(column)的順序
注意:md同樣可以爲其他，*代表要偏移的數字
push爲向後偏移 ； pull爲向前偏移
push和pull偏移時不會對其他列造成影響（附圖）
如圖所示，col-md-3向後偏移的2列，col-md-4向前偏移了2列，且它們都沒有互相造成影響
