本文介绍了Boostrap 3 - col-md-4 到 col-sm-6，或 3x2 到 2x3 的网格的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着跟版网的小编来一起学习吧！
问题描述
如何将 3x2 的网格更改为 2x3，而不会有一行结束另一行开始的空白空间?
How can I change a grid of 3x2 to 2x3 without having an empty space where one row ends and another starts?
例如:
<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>
这就是我想要实现的目标:
This is what I want to achieve:
这个:
对此:
但是我得到了这个:
推荐答案
只需将它们放在一行中 - 它会自动结束.
Just put it all in one row - it'll wrap down automatically.
<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>
JSFiddle
这篇关于Boostrap 3 - col-md-4 到 col-sm-6，或 3x2 到 2x3 的网格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！
本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益，请联系我们，我们会在确认后第一时间进行删除！