bootstrap裏面col-xs , col-sm ,col-md,col-lg的使用

col-lg一般用於大屏設備,
(min-width:1200px);

col-md一般用於中屏設備,
(min-width:992px);

col-sm一般用於小屏設備,
(min-width:768px);

col-xs用於超小型設備,
(max-width:768px);

後面跟數字是幾,也就是佔幾份,
比如是4,也就是一行可以顯示3個;
或者12,就是一行可以顯示1個。

關於使用,一般設置的話四個屬性都用到會比較好,這樣就可以在不同屏幕上很好的展示。
比如你有了12個section標籤,你想讓他們在不同屏幕大小的時候有不同的展示方式,大屏時一行顯示6個,中屏時一行顯示3個,小屏時一行展示2個,超小屏一行展示1個,你就可以在每一個section標籤裏面這樣寫:
<section class = “col-lg-2 col-md-4 col-sm-6 col-xs-12”></section>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章