css - Foundation 5如何为小屏幕制作一栏

我有使用zurb-foundation的以下网格：

<div class="row">
 <div class="small-6 large-3 columns">&nbsp;</div>
 <div class="small-6 large-9 columns">&nbsp;</div>
</div>

上面的网格构成了两列的布局。但是，我想知道在小屏幕中将上述布局设置为一列而不是6的两列。换句话说，我希望该行的第二个div充当小屏幕的新行。

最佳答案

假设您使用的是标准的12列网格，并且没有修改，只需将较小的12列设置为：

<div class="row">
 <div class="small-12 large-3 columns">&nbsp;</div>
 <div class="small-12 large-9 columns">&nbsp;</div>
</div>

只是知道小型过滤器正在上升...所以在此示例中，“中”也将为12。如果您希望中型看起来像大，则可以这样做：

<div class="row">
 <div class="small-12 medium-3 columns">&nbsp;</div>
 <div class="small-12 medium-9 columns">&nbsp;</div>
</div>

请注意，在上面的示例中，您不需要大号，因为中号可以过滤上面的所有内容。

关于css - Foundation 5如何为小屏幕制作一栏，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/24399141/