3.1栅格系统简介

栅格系统英文为"gridsystems" ,也有人翻译为“网格系统”, 它是指将页面布局划分为等宽的列,然后通过列数的定义来模块化页面布局。

Bootstrap提供了一套响应式、移动设备优先的流式栅格系统,随着屏幕或视口( viewport)尺尉的增加,系统会自动分为最多12列。

Bootstrap里面container宽度是固定的,但是不同屏幕下, container的宽度不同,我们再把container划分为12等份

3.2栅格选项参数

栅格系统用于通过一系列的行( row )与列( column )的组合来创建页面布局,你的内容就可以放入这些创建好的布局中。

注意：

行( row )必须放到container布局容器里面

我们实现列的平均划分需要给列添加类前缀

xs-extra small :超小lism-small :小; md-medium :中等; lg-large :大;

列( column )大于12,多余的列( column )”所在的元素将被作为-个整体另起一行排列

每一列默认有左右15像素的 padding

可以同时为-列指定多个设备的类名,以便划分不同份数例如class= "col-md-4 col-sm-6"

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！