栅格系统

栅格系统

在用这个系统之前,这个系统需要一个容器 这个容器不能写宽

container  固定宽容器

container-fluid 100%容器 永远占屏幕的100%

行(row)

列(col)

默认把每一行分成了12列

行包列

如果屏幕尺寸小于设置的范围,会默认往下排列

.col-xs-2  超小号  <768的时候  手机

.col-sm-  小屏    >=768      pad

.col-md-  中平    >=992      普通电脑

.col-lg-  大屏    >=1200    大屏

利用他实现响应式

只要前一个元素和后一个元素加起来大于12,后一个就下去

如果想要一块消失 clearfix visible-xs-block

col-md-offset-4  偏移量 向右偏移4位  可以配合不同尺寸来设置

col-lg-offset-4

col-xs-offset-4

col-sm-offset-4

row 里面可以继续放row

里面的row是按父级继续分12分

.col-md-push-  向后几格

.col-md-pull-* 向前几格

让一个块隐藏hidden-md|lg|xs|sm

你可能感兴趣的:(栅格系统)