Zurb Foundation 3 - 全宽度区块和更改最大宽度？

Question

6

我在我自己的项目中使用ZURB Foundation 3。虽然我喜欢网格系统和响应式网站，但我认为它们应该比1000像素宽。

我有几个问题：

1）首先，我想将某些部分（divs）设置为全宽。我已经了解到可以将<div class="row">替换为<div class="container">，这样就可以实现该效果。但由于某种原因，我觉得这不太正确。我应该创建自己的全宽类，还是该怎么做才合适？

2）我希望它基于更大的分辨率，最多达到1440像素宽或者是流体式的100%全宽。我该如何做，或者Foundation是否不适合我？我喜欢它带有所有模板，所以制作样机非常快速和友好。

谢谢您的帮助。

- matt

为特定宽度设计与响应式设计的整体概念相冲突。 - cimmanon

1

我明白，但是我想把默认的“max-width”从1000px或960px增加到1440px等。这不应该影响响应性。请告诉我为什么它们总是有940-1000px的最大宽度？ - matt

@cimmanon 他不是在问如何创建特定宽度，而是在问如何设置Foundation框架中提供的最大设计宽度。Max-width != width - Ed Charbeneau

3个回答

7

修改/覆盖基础设置很容易。在Foundation 4中，您可以编辑_settings.scss文件。取消注释 $row-width: emCalc(some_number.px); 并将其设置为所需的行宽度。

- BisonAVC

1

取消注释$row-width: rem-calc(1000); 对我有效

- AnkitG

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Ed Charbeneau · Accepted Answer

更新:请停止对此帖子进行负面评价。自提问以来，该框架已发生重大变化。如果您正在使用Foundation 4或更高版本，请查看更新的答案并给它们点赞。

仅适用于较早版本的 Foundation 3 将以下覆盖添加到您的CSS中（这必须出现在foundation.css之后或结尾处）

.row {
     width: 100%;
}

这将覆盖框架的默认宽度并使设计全屏。随意更改此值以适应您的需求。

还可以在http://foundation.zurb.com/download.php获取定制下载（可能做相同的事情，覆盖或替换.row宽度）