Zurb Foundation 3 - 全宽部分&更改最大宽度?

时间:2012-10-11 17:09:36

标签: css html5 frameworks responsive-design media-queries

我在我的项目中使用ZURB Foundation 3。我喜欢网格系统和响应式网站,但我的问题是我仍然坚信它们应该比1000px更宽。

我有几个问题:

1)首先,我希望将某些部分(div)全宽。现在我已经阅读了我可以将<div class="row">替换为<div class="container">,例如它会产生这种效果。现在由于某些原因,这感觉不对,我应该创建我自己的全宽度类,或者这样做的正确方法是什么?

2)我希望它能够以更大的分辨率为基础,最大可能是1440px宽,甚至是100%全宽的流体。我怎么能这样做,和/或基金会不是我的正确框架?我喜欢它附带所有模板的事实,因此非常快速和友好地做模型。

提前致谢。

3 个答案:

答案 0 :(得分:11)

更新:请停止投票。自问题得到解答以来,框架发生了重大变化。如果您使用的是Foundation 4或更高版本,请查看更新的答案并进行投票。

仅适用于Foundation 3的早期版本 将以下覆盖添加到CSS(这必须出现在foundation.css之后或结束时)

.row {
     width: 100%;
}

这将覆盖框架的默认值并使设计全屏显示。随意更改此值以满足您的需求。

http://foundation.zurb.com/download.php还提供定制下载(可能会做同样的事情,覆盖或替换.row宽度)

答案 1 :(得分:7)

编辑/覆盖基础很容易。在Foundation 4中,您可以编辑_settings.scss文件。取消注释$ row-width:emCalc(some_number.px);到你想要使用的行宽。

答案 2 :(得分:1)

取消注释$row-width: rem-calc(1000);为我工作