使用内置的栅格系统将内容再次嵌套,可以通过添加一个新的 .row 元素和一系列 .col-* 来实现。
记得嵌套的要放在col里面,不要放在row里面。
层次应该是:
body → container → row → col → row → col
不要再套一层container。
<body>
<div class="container">
<div class="row show-grid">
<div class="col-md-4 col-md-offset-4">
<div class="row">
<div class="col-md-1">.col-md-1</div>
<div class="col-md-1">.col-md-1</div>
<div class="col-md-1">.col-md-1</div>
<div class="col-md-1">.col-md-1</div>
<div class="col-md-1">.col-md-1</div>
<div class="col-md-1">.col-md-1</div>
<div class="col-md-1">.col-md-1</div>
<div class="col-md-1">.col-md-1</div>
<div class="col-md-1">.col-md-1</div>
<div class="col-md-1">.col-md-1</div>
<div class="col-md-1">.col-md-1</div>
<div class="col-md-1">.col-md-1</div>
</div>
</div>
</div>
</div>
</body>Code language: HTML, XML (xml)
Previous: 08-列偏移
Next: 10-列排序pull和push