bootstrap grid的用法：1、使用container來包裹div；2、在div裡面設定行；3、設定列能夠快速地建立這個框架；4、透過拖曳瀏覽器來改變寬窄即可。

本文操作環境：Windows7系統、bootstrap3、Dell G3電腦。

bootstrap的grid怎麼使用？

div使用container來包裹，然後在裡面設定行，設定行後再設定列能夠快速對這個框架進行搭建

 
Hello, world!
 
 
 
 第一列占1个md 
 
 
 
 这个是第二列 占 2 个md 
 
 
 
最后一个md占9个列 
 
 
 

保障總數為12個，透過拖曳瀏覽器改變寬窄可以看出變化。

此外螢幕大小也會影響，這個時候列的class也要使用大型的那個col，透過拖曳瀏覽器可以看出變化。

 
 
 中型占6，大型占4 
 
 中型占6，大型占8 
 
 

整個格柵大小分配

.col-xs- 超小屏幕 手机 (<768px) .col-sm- 小屏幕 平板 (≥768px) .col-md- 中等屏幕 桌面显示器 (≥992px) .col-lg- 大屏幕 大桌面显示器 (≥1200px)

推薦：《bootstrap教程》

以上是bootstrap grid用法的詳細內容。更多資訊請關注PHP中文網其他相關文章！