如果已经有一个中型或小型的n类,为什么要使用大n类?

时间:2014-04-11 21:22:56

标签: zurb-foundation

在浏览基金会5样本和zip包装的index.html时,我发现很多次会有这样的标记:

<div class="large-4 medium-4 columns"> ... </div>

一旦你拥有4号媒体,那么它也会被继承用于更大的显示器?

沿着同样的路线,有时会有:

<div class="large-12 columns"> ... </div>

真的有必要吗?默认情况下,列不占用12列吗?

1 个答案:

答案 0 :(得分:1)

是的,因为Foundation是一个移动优先的框架,任何更大的类都将继承较小类的列数。

当您将这些类与visibility结合使用时,您可能想要指定small-X medium-X large-X等的原因示例。我们假设我们在大型显示器中有三列,例如

<div class="small-12 medium-6 large-4 columns">
    COLUMN #1 with stuff that shows in a small, medium, or large width screen.
</div>
<div class="medium-6 large-4 columns show-for-medium-up">
    COLUMN #2 with stuff that shows in a medium or large width screen.
</div>
<div class="large-4 columns show-for-large-up">
    COLUMN #3 with stuff that shows in a large width screen only.
</div>

对于中等宽度的屏幕,当隐藏COLUMN#3时,您希望COLUMN#1和COLUMN#2拥有类medium-6。对于隐藏COLUMN#2和COLUMN#3的小宽度屏幕,您希望COLUMN#1拥有类small-12

希望这有帮助!