BootStrap栅格布局

来源:互联网 发布:长整型数java 编辑:程序博客网 时间:2024/05/17 05:56

BootStrap将屏幕分为12等分,在具体的DIV中,可以通过设置DIV的所占等分的数字确定其在屏幕中占有的宽度。如:

  1. <divclass="row“><!--表示另起一行-->
  2. <divclass="col-md-8"style="border:1px solid black;height:100px;"></div>
  3. <divclass="col-md-4"style="border:1px solid black;height:100px;"></div>
  4. </div>
在第一个DIV中class="col-md-8",第二个DIV中class="col-md-4", 其中‘8’和‘4’就是其DIV所占屏幕宽度的数值,加在一起等于‘12’。也就是第一个DIV占整个屏幕宽度的‘8/12’,第二个DIV占‘4/12’。 注:在上述代码中为了突显区块,我们设置了DIV的边框宽度为1像素黑色实线,高度设为100像素。

0 0