如何在Foundation 6中禁用响应式网格

Question

我目前正在使用新的Foundation 6开发响应式网站，但我似乎无法通过版本教程找到如何禁用响应式网格（我需要让客户选择它） 5.

非常感谢。

Answer 1

从标头中删除此 meta 标记。

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

您还可以选择使用filzhut的Responsive Switch。

Answer 2

删除行，列和列类的样式。

将此css代码块添加到标题之后您希望删除网格样式的每个页面上的基础css链接。或者，您可以在底部的基础CSS文件中包含该样式：

<style type="text/css">
    .row, .column, .columns { margin: 0 !important; padding: 0 !important; float: none !important; display: block !important; position: static !important; width : auto !important;  max-width: none !important; clear: none !important; }
</style>

这就是我的意思，将样式添加到foundation.min.css文件的底部以删除网格样式。此外，这意味着您必须在本地托管css文件，而不是使用cdn。

现在，至于为您的客户选择网格或无网格，您可以向他们展示两个开发站点，一个是网格，另一个没有网格。或者，您可以在页面上放置一个按钮或某个元素，并使用js添加和删除表单中的css或元素以使用服务器脚本执行此操作。在您的问题中，您引用了：

  

通过版本5的教程

我没有找到任何有关网格css开关的f5教程，提供链接，我可能会更新这个答案。