如何在没有空行的情况下将3x2的网格更改为2x3,其中一行结束而另一行开始?
例如:
<div class="row">
<div class="col-md-4 col-sm-6">
content
</div>
<div class="col-md-4 col-sm-6">
content
</div>
<div class="col-md-4 col-sm-6">
content
</div>
</div>
<div class="row">
<div class="col-md-4 col-sm-6">
content
</div>
<div class="col-md-4 col-sm-6">
content
</div>
<div class="col-md-4 col-sm-6">
content
</div>
</div>
这就是我想要实现的目标:
此:
对此:
但我得到了这个:
答案 0 :(得分:7)
将它全部放在一行 - 它会自动包裹。
<div class="row">
<div class="col-md-4 col-sm-6">
content 1
</div>
<div class="col-md-4 col-sm-6">
content 2
</div>
<div class="col-md-4 col-sm-6">
content 3
</div>
<div class="col-md-4 col-sm-6">
content 4
</div>
<div class="col-md-4 col-sm-6">
content 5
</div>
<div class="col-md-4 col-sm-6">
content 6
</div>
</div>
答案 1 :(得分:4)
将它们全部放在一行中。见this bootply
像:
<div class="row">
<div class="col-md-4 col-sm-6">
<span class="box">content</span>
</div>
<div class="col-md-4 col-sm-6">
<span class="box">content</span>
</div>
<div class="col-md-4 col-sm-6">
<span class="box">content</span>
</div>
<div class="col-md-4 col-sm-6">
<span class="box">content</span>
</div>
<div class="col-md-4 col-sm-6">
<span class="box">content</span>
</div>
<div class="col-md-4 col-sm-6">
<span class="box">content</span>
</div>
</div>