Bootstarp第二章

最新推荐文章于 2022-10-17 20:40:26 发布

原创最新推荐文章于 2022-10-17 20:40:26 发布 · 273 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#bootstrap

Bootstarp 专栏收录该内容

3 篇文章

订阅专栏

栅格系统，又称网格系统，是前端开发中的一个重要概念，由容器、行和列构成，最多容纳12列。它通过隐藏或显示不同屏幕尺寸下的元素（如lg、md、sm和xs），实现网页在不同设备上的响应式布局。例如，`hidden-lg`在大屏上隐藏内容，而在其他屏幕尺寸上显示。`visible-xs`则只在超小屏上显示。这种设计方法确保了在各种屏幕尺寸上的用户体验。

类名	    大屏 lg					中屏 md			   小屏 sm		`超小屏 xs
hidden-lg		隐藏					显示				显示			显示
hidden-md		显示					隐藏				显示			显示
hidden-sm		显示					显示				隐藏			显示
hidden-xs		显示					显示				显示			隐藏

visible-lg		显示					隐藏				隐藏			隐藏
visible-md		隐藏					显示				隐藏			隐藏
visible-sm		隐藏					隐藏				显示			隐藏
visible-xs		隐藏					隐藏				隐藏				显示

什么是栅格系统？
栅格系统又名网格系统，是有容器+行+列组成
容器最多容纳12列，多一列会在下一行显示，少一列，会把该列的位置空着