Bootstrap动态col调整大小[重复]

Question

所以我想要实现的就是这个。当页面首次加载时，我希望显示：

col-md-6 | col-md-3 | col-md-3

但是当窗口被调整大小时（或在较小的屏幕设备上查看时），我想要拥有

col-md-4 | col-md-4 | col-md-4

有没有办法在没有 CSS 黑客的情况下使用 Bootstrap 来做到这一点？

Answer 1

我认为你需要这样的东西。

<div class="row">
  <div class="col-md-6 col-sm-4"></div>
  <div class="col-md-3 col-sm-4"></div>
  <div class="col-md-3 col-sm-4"></div>
</div>

这样做的目的是，对于中到大屏幕，尺寸比例为 6/12、3/12 和 3/12。

对于较小的屏幕，div 将占据可用宽度的 4/12、4/12、4/12。