SASS按变量输出多个不同的文件

时间:2013-10-10 14:40:37

标签: css sass

我正在开发一个涉及每个子页面的不同主题的项目。每个子页面都具有与框架完全相同的HTML标记,但在每个子页面上,相同的元素(如标题)必须具有不同的颜色。

我解决这个问题的方法是让每个声明在相应CSS文件中的子页面上有所不同,例如red.css或blue.css。这些文件只包含必须不同的选择器的颜色声明,因此font-size和其他所有内容都在全局CSS文件中。

我希望实现的是在文件中声明颜色变量,并为主题CSS文件创建一个SCSS框架,其中包含CSS声明的相应变量。以更清晰的方式:

变量声明的示例:

$red: red;
$blue: blue;

主题框架SCSS文件看起来像这样:

h1 {
   color: $heading-color;
}

目标是让SASS循环遍历变量并创建具有相同帧的X个不同的CSS文件,但是每个文件都应该在正确的位置具有相应的值,所以blue.css应该具有蓝色值,红色应该有红色值等。

这可能吗?我试图避免的是使X SCSS文件中包含精确的框架,但是它们的值的值不同,因为这意味着每次更改时都会编辑X编号。

0 个答案:

没有答案