我正在尝试在基于 4 列的响应式结构中显示元素，如下所示：
+------------------------ row ------------------------+
[--col-*-3--] [--col-*-3--] [--col-*-3--] [--col-*-3--]
+------------------------ row ------------------------+
[--col-*-3--] [--col-*-3--] [--col-*-3--] [--col-*-3--]
因此，我继续迭代这些项目：
<div class="row">
<?php foreach ($items as $i): ?>
<div class="col-lg-3">
<?php echo $i->getName(); ?>
</div>
<?php endforeach; ?>
</div>
上面的代码适用于 4 个或更少的项目，因为 Twitter 引导网格系统（我认为是这样）基于每行 12 个列。我想避免这种情况：
+------------------------ row ------------------------+
[--col-*-3--] [--col-*-3--] [--col-*-3--] [--col-*-3--]
[--col-*-3--] ...
+------------------------ row ------------------------+
[--col-*-3--] [--col-*-3--] [--col-*-3--] [--col-*-3--]
因此，有些人可能会说"对数组进行分块或使用标志来跟踪行是否填充"。但是我想避免在 html 文件中执行这些操作。我的问题是，我如何处理这种设计，保持结构four columns而不会破坏响应式布局？提前谢谢你
我认为这不会破坏您的布局。您的解决方案应该有效，我已经尝试过类似的东西。也许是 .col-lg 破坏了您对较小屏幕的解决方案？下面是一个带有 .col-xs 的示例。您是否尝试为每个屏幕分辨率指定列的宽度？
...
<div class="col-lg-3 col-md-3 col-xs-3">
...
</div>
...