6-2
BootStrap3 及 BootStrap4 的斷點比較
- BootStrap4 的斷點前綴詞範圍和BootStrap3 不同:
- 最小斷點改為 575px,
- 又多了一個
col-xl
前綴詞,
- 並將
col-xs
改為 col-
,
- 此外,BootStrap3 一定要設寬度,例如
col-sm-3
、col-sm-9
,但在 BootStrap4 允許不設寬度,例如四組 col-sm
時,每個欄位會自動調為 25%,因此,可以輕鬆做到五欄、七欄、八欄...等效果。
- 斷點差異比較表:
|
575 px 以下 |
576 ~ 767 px |
768 ~ 991 px |
992 ~ 1199 px |
1200 px 以上 |
BootStrap3 前綴 |
col-xs |
col-sm |
col-md |
col-lg |
BootStrap4 前綴 |
col- |
col-sm |
col-md |
col-lg |
col-xl |
對應裝置 |
any |
手機 |
平板 |
桌機螢幕 |
大螢幕 |