在bootstrap中，柵格系統的作用是讓同一套頁面可以適應不同解析度的裝置；該系統將每一行平均分成12個格子，然後指定同一個元素在不同裝置上佔用的格子數目不同，從而實現不同設備的頁面佈局。
本教學操作環境：Windows10系統、bootstrap3.3.7版、DELL G3電腦
1.bootstrap柵格系統：作用就是使得同一套頁面可以適應不同的解析度的設備
2.柵格系統的實現：將每一行平均分為12個格子，然後指定同一個元素在手機裝置和pc裝置上佔用的格子數目不同，例如：一個div佔用電腦4個格子，在手機上佔用12個格子
3.步驟
1 .定義容器：相當於table 表格
*容器分類：
1.container：固定寬度隨著不同裝置而不同（留白）
2.container- fluid：100%
2.定義行：相當於tr 樣式：row
3.定義元素：指定該元素在不同的裝置上，所佔的格子數目。樣式：col-裝置代號-格子數目
*裝置代號：
1.xs：超小螢幕手機（768px）：col-xs-12
#2. sm：小螢幕平板（>=768px）
3.md：中等螢幕桌面顯示器（>=992px）
4.lg：大螢幕大桌面顯示器（>= 1200px）
**注意：一行中如果格子的數目超過12個，超出的部分自動換行
**注意：定義的類別屬性可以向上相容，而向下不相容，如果設備的寬度小於你設定的柵格類別屬性的設備的代號的最小值，預設會一個元素佔滿一整行。
相關推薦：bootstrap教學
#以上是bootstrap的柵格系統有什麼用的詳細內容。更多資訊請關注PHP中文網其他相關文章！
