码迷,mamicode.com
首页 > 其他好文 > 详细

bootstrap栅格化布局

时间:2015-09-15 07:10:56      阅读:127      评论:0      收藏:0      [点我收藏+]

标签:

之前我只知道bootstrap会自动生成12列,但是他会根据页面的大小而自动换行

当屏幕小于768px即为手机屏幕的时候 栅格行为总是水平排列 类的前缀为.col-xs

当屏幕大于768px时,最大列宽为62px,类前缀为col-sm

当屏幕大于992px时,最大列宽为81px ,类前缀为col-md

当屏幕大于1200px时,最大列宽为97px,类前缀为col-lg


根据这一规律 ,假设我们想让一个网页在手机上显示三行 在平板上显示两行,在桌面上显示一行 则可以设置类为

col-md-12

col-sm-6

col-xs-4


bootstrap栅格化布局

标签:

原文地址:http://my.oschina.net/u/2385858/blog/506115

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!