Bootstrap(二)—格栅系统!
W=(A*n)-i
W是一个页面的总宽度,比如950px;而A代表一个版块的宽度,设置为apx;n就是分为几个版块;而i就是区块之间的间隔。
例如 950=(a*24)-10 而a=40px;改变A和i的值就会生成不同的布局。
(高度960=24*40 宽度 560=14*40 )
而bootstrap格栅系统为12列(1,2,3,4,6,12)形成960px的宽度。
以下场景非常适合格栅系统:
- 页面的总体宽度布局,比如两栏、三栏等布局
- 一些固定区块的尺寸,比如广告图片的尺寸
- 区块之间的间距,可以参考栅格系统的槽宽(Gutter)
- 一些可以栅格化的小区域,暗合栅格往往能简化布局上的考虑。
阅读与:http://ued.taobao.com/blog/2008/09/grid_systems/。
http://ued.taobao.com/blog/2008/10/grid_system_research_1/
http://ued.taobao.com/blog/2008/10/grid_system_research_2/。
http://www.cnblogs.com/binyong/archive/2011/10/02/2197984.html。
http://www.cnblogs.com/yjmyzz/archive/2009/08/20/1550895.html。
基于thinkphp3.1.3的开发
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步