指南针：编译样式表将“黑色”更改为“＃000”

Question

我正在使用compass来生成我的CSS样式表。

在我的样式表中，我有几个mixin用于生成类。其中许多类都带有“black”这个词。

一切运行正常。但是，当我编译生产的scss样式表时，“black”会在最终的样式表中被替换为#000，这会破坏我的类。

我该如何防止这种情况发生？

我用来编译样式表的代码是：

compass compile -e production --force

这是在Compass文档中列出的命令。

- big_smile

---

为什么这会破坏你的类？黑色和#000在外观上是相同的。 - PhonicUK

抱歉！我没有解释清楚。这是我的Scss代码：.black { color: black; }。这是Compass生成的代码：.#000 {color: #000;}。HTML代码为<div class="black">，所以.#000黑色类不再起作用。 - big_smile

使用这样的类名会引起麻烦...除非你真的在处理颜色方案，否则你应该选择实际上有语义意义的名称。 - Christoph

是的，我正在使用颜色方案（我正在制作颜色目录）。我可以更改名称，但这会使代码不太易读。如果不是因为颜色方案，我可以使用其他东西，例如.alert{}或.primary{}，代码仍然易读。我可以理解指南针更改color:black，但它不应该保留.black吗？ - big_smile

@big_smile 哦，我明白了。看起来是指南针中的一个错误。那么叫它 .color_black 怎么样？ - PhonicUK

Answer 1

问题在于颜色关键词被解释为颜色值，而不是字符串。您可以通过用引号将它们包围来将它们强制转换为字符串。例如：

$classname: "black";
$color: black;

.#{$classname} {
  color: #{$color};
}

这样做可以压缩颜色属性值，但类名不会受影响。

- hopper