css - 为什么我的 CSS 变量不起作用？

Question

我是第一次使用 CSS 变量，但无法正常工作。我在 Chrome 上实现了它，并对我的代码进行了三重检查。

@default: red;
#myDiv {
color: @default;
}
<div id="myDiv">Hello World</div>

Answer 1

不幸的是，css 本身不支持变量，但有一些库可以增强 css 语法，允许您使用变量等。最受欢迎的是 Matt Bell 提到的 Less 和 Sass。

基本上他们所做的是解析您编写的文件，并输出一个文件，其中您使用的所有 css 变量和函数都被编译成一个有效的 CSS 文件，您可以在您的网页中包含/使用该文件。

http://sass-lang.com/
http://lesscss.org/

W3C CSS 官方规范:
http://www.w3.org/TR/CSS/

编辑:

自从几年前最初回答以来，情况发生了变化。 CSS 变量现在是规范的一部分

有关文档/解释，请查看 excellent MDN article .

当前/最新的支持和统计信息 check out caniuse.com .