我使用 zurb-foundation 有以下网格:
<div class="row">
<div class="small-6 large-3 columns"> </div>
<div class="small-6 large-9 columns"> </div>
</div>
上面的网格布局为两列。但是，我想知道在小屏幕中使上述布局成为一列布局，而不是两列 6。换句话说，我希望该行的第二个 div 充当小屏幕的新行。
最佳答案
假设您使用的是标准的 12 列网格并且没有对其进行修改，只需将较小的网格设为 12:
<div class="row">
<div class="small-12 large-3 columns"> </div>
<div class="small-12 large-9 columns"> </div>
</div>
只要知道小过滤器的大小是向上的...因此在本例中“中”也将是 12。如果您希望中看起来像大，请执行以下操作:
<div class="row">
<div class="small-12 medium-3 columns"> </div>
<div class="small-12 medium-9 columns"> </div>
</div>
请注意，您不需要上例中的大型作为中型过滤器，直到其上方的所有内容。
关于css - Foundation 5 如何为小屏幕制作一栏，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24399141/