如何使Zurb Foundation不响应？

我已经建立了一个以Foundation-master wordpress为主题的网站, 它看上去不错, 但是我不喜欢它在其他浏览器宽度下的表现。有没有办法使它无响应, 或固定到一定的宽度？

谢谢！

#1

建立Foundation只是为了创建响应式网站。除了不使用响应式Webseite为何要使用此框架的问题之外, 只有在开始删除基础CSS中的所有媒体查询并通过删除视口元标记时, 才有可能使用该框架。

也许你应该更好地利用这段时间来使你的Webseite响应, 使其也适合较小的屏幕和移动设备。

有时有必要停用响应功能。例如, 如果像我已经经历过两次一样, 一个网站正在启动无响应, 并且稍后添加了针对智能手机/平板电脑的优化。

Foundation是一个很棒的框架, 即使你消除了响应能力。 SCSS文件的结构非常好, 它带有一个非常有用的UI元素库。如果你问我, 这是响应式和非响应式网站的绝佳选择。有些人可能还希望简化其工作流程, 而不希望根据项目而在不同的框架之间切换, 以保持较低的成本。

无论如何, 这是我的两分钱。这取消了我的所有响应能力：

.row {  
     width: 62.5rem;
}

然后在_settings.scss中

$small-range: (0, 90em);
$medium-range: (0, 90em);
$large-range: (0, 90em);

这样, 我们基本上总是看到大型版本。据我所知, 这甚至适用于顶部栏等。

尽管该问题被标记为”已回答”, 但我只是想给你一个快速提示, 以防止Foundation 4网格做出响应, 因为我们也必须对此进行处理。

在我们的案例(SASS版本)中, 通过CSS将<body>元素的宽度设置为网格的特定宽度, 并将SASS变量$ small-screen中的断点减小为1px可以正常工作。

尝试在主体属性中添加最小宽度, 如下所示：

html, body {
  font-size: 100%; 
  min-width: 1020px;
  }

(foundation.css)