bootstrap-网格系统

网格系统:

.container  : 行必须放置在 .container class 内,以便获得适当的对齐(alignment)和内边距(padding)

.row :行内的列总数必须为12.

.col-lg- :大型设备台式电脑(≥1200px)

.col-md- :中型设备台式电脑(≥992px)

.col-sm- :小型设备平板电脑(≥768px)时使用

.col-xs-  :超小设备手机(<768px)时使用

.col-*-offset-* : 列偏移,如.col-md-offset-3,意思是将元素的左外边距增加三列,偏移的列数范围为1-11

.col-*-push-*:向后移动,如 .col-md-push-4,向后移动4列

.col-*-pull-*:向前移动,如.col.md-pull-4,向前移动4列

响应式实用工具:

.visible-lg

.visible-md

.visible-sm

.visible-xs

.hidden-lg

.hidden-md

.hidden-sm

.hidden-xs

.visible-*-block

.visible-*-inline

.visible-*-inline-block

清除浮动:.clearfix

媒体查询:

@media (min-width: @screen-sm-min){. . .}

@media(max-width:@screen-sm-max){. . .}

@media(min-width:@screen-sm-min) and (max-width:@screen-sm-max){. . .}

 

posted @ 2018-04-09 14:36  三个砂锅  阅读(145)  评论(0编辑  收藏  举报