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

Bootstrap---Fluid layout 流布局

时间:2014-08-25 21:19:45      阅读:216      评论:0      收藏:0      [点我收藏+]

标签:style   color   ar   div   代码   line   sp   size   on   

流布局是一种适应屏幕的做法。即不固定块的宽度,而是采用百分比作为单位来确定每一块的宽度。这种布局非常适合一次编写,然后自适应各种不同大小的屏幕(手机,PAD…)。

<div class="container-fluid">

  <div class="row-fluid">

    <div class="col-md-2">

    </div>

    <div class="col-md-10">

    </div> 

  </div> 

</div>

       按顺序添加这几个类。最外面包含块有 container-fluid类,表明内容布局是流布局,其主要作用是作为一个包含块来容纳流布局内容。里面包含块的内容有 row-fluid类(非常重要),决定是否是流布局。然后里面的内容块代码编写与网格系统一致,依然是从col-md-21col-md-12,分别对应于不同的百分比。



Bootstrap---Fluid layout 流布局

标签:style   color   ar   div   代码   line   sp   size   on   

原文地址:http://my.oschina.net/nly/blog/306505

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