stylesheet - 通过 Sass / Compass 实现页面特定样式

Question

我想使用特定于页面的样式，例如仅应用于即联系人页面的contact.css（已编译）。

我编译了一个 screen.css，它导入了包含全局变量、自定义 mixins、类等的 _base.css，但问题是如果它包含来自 _base.css 的全局变量，我不能使用 contact.css 样式——即使使用在contact.css（链接）之前设置的screen.css总是输出错误。如果我将变量导入到 contact.scss 本身，我就会得到重复的样式。

我该怎么办，如何定位特定页面并在 Sass 中保留全局变量？

谢谢。

Answer 1

在需要的地方创建_globalvariables.scss和导入，包括_base.scss.

对于您的screen.scss（或其他）， import _base.scss，对于contact.scss只需要变量的工作表，仅 import in _globalvariables.scss。

换句话说，将你的 mixin 和变量保存在一个表单中，而不需要任何直接编译为 CSS 的东西，这样你就可以将它导入到你想要的地方，而不必处理重复的样式声明。