使用 Bourbon/Neat/Refills 的移动断点

Question

我使用bourbon/neat/bitters/refills 为sass 创建了一个rails 应用程序。

到目前为止，已尝试添加一些笔芯：居中导航和英雄。

在桌面浏览器中进行测试并将窗口大小调整到最小断点非常有效：从大断点切换到中断点再到最小断点（水平导航最终折叠并在下方一列布局）。

但是，当实际在 iphone 上查看时，它似乎在 safari 中显示桌面断点布局以进行所有重新填充。

还有其他人遇到过这个问题吗？

Answer 1

什么对我有用（元视口）

经过很长时间，我发现了这个。

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

它成功了。

---

关于萨斯

小心填充，正如 Ian Wootten 所说here，这不是 CSS，这是 SCSS，所以你必须编译它来生成 CSS。 最简单的方法是结帐http://sass-lang.com/install

安装Sass，然后使用命令生成HTML（编译）

sass --watch input.scss:output.css

按照此处的完整说明进行操作：using sass docs