bootstrap

1、.span4已经不适用，改成col-XX-xX

容器：container，全屏布局：container-fluid(流式？)，row-fluid无效了（？）.col-md-offset-x

See how aspects of the Bootstrap grid system work across multiple devices with a handy table.

	Extra small devicesPhones (<768px)	Small devices Tablets (≥768px)	Medium devicesDesktops (≥992px)	Large devices Desktops (≥1200px)
Grid behavior	Horizontal at all times	Collapsed to start, horizontal above breakpoints
Container width	None (auto)	750px	970px	1170px
Class prefix	.col-xs-	.col-sm-	.col-md-	.col-lg-
# of columns	12
Column width	Auto	~62px	~81px	~97px
Gutter width	30px (15px on each side of a column)
Nestable	Yes
Offsets	Yes
Column ordering	Yes

 

 

2、row margin 负值（转，来自某网站，记录一下）

在 Bootstrap 的网格系统当中，每一个使用 col-**-* 类的列元素都应该包裹在 row 类的元素当中。为了使页面美观每个col-**-* 的类都设置了左、右15个像素的补白 padding，这样会导致一个结果，第一个和最后一个元素会离开容器15个像素的距离。为此，Bootstrap在 row 类当中分别定义了左、右方向15个像素的 margin 负值来抵消第一列和最后一列产生的左右补白。

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px; } .row { margin-right: -15px; margin-left: -15px; }

转载于:https://www.cnblogs.com/haitangxun/p/4394182.html