一、基本用法
class&＃61;"container">
class&＃61;"row">
class&＃61;"col-md-4">.col-md-4
class&＃61;"col-md-8">.col-md-8
class&＃61;"row">
class&＃61;"col-md-4">.col-md-4
class&＃61;"col-md-4">.col-md-4
class&＃61;"col-md-4">.col-md-4
class&＃61;"row">
class&＃61;"col-md-3">.col-md-3
class&＃61;"col-md-6">.col-md-6
class&＃61;"col-md-3">.col-md-3
.conatainer>row>col-md-x ,一个row下面x的总和不超过12
二、列偏移
class&＃61;"container">
列向右移动四列的间距
class&＃61;"row">
class&＃61;"col-md-4">.col-md-4
class&＃61;"col-md-2 col-md-offset-4">列向右移动四列的间距
class&＃61;"col-md-2">.col-md-2
class&＃61;"row">
class&＃61;"col-md-4">.col-md-4
class&＃61;"col-md-4 col-md-offset-4">列向右移动四列的间距
列偏移和列本身相加不能超过12
三、列排序
列排序其实就是改变列的方向&＃xff0c;就是改变左右浮动&＃xff0c;并且设置浮动的距离。在Bootstrap框架的网格系统中是通过添加类名“col-md-push-*”和“col-md-pull-*” (其中星号代表移动的列组合数)。
class&＃61;"container">
class&＃61;"row">
class&＃61;"col-md-3 col-md-push-7">.col-md-4
class&＃61;"col-md-8 col-md-pull-4">.col-md-8
四、列嵌套
Bootstrap框架的网格系统还支持列的嵌套。你可以在一个列中添加一个或者多个行&＃xff08;row&＃xff09;容器&＃xff0c;然后在这个行容器中插入列&＃xff08;像前面介绍的一样使用列&＃xff09;。但在列容器中的行容器&＃xff08;row&＃xff09;&＃xff0c;宽度为100%时&＃xff0c;就是当前外部列的宽度。
class&＃61;"container">
class&＃61;"row">
class&＃61;"col-md-8">我的里面嵌套了一个网格
class&＃61;"row">
class&＃61;"col-md-6">col-md-6
class&＃61;"col-md-6">col-md-6
class&＃61;"col-md-4">col-md-4
京公网安备 11010802041100号