为什么我的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变量现在是规范的一部分

有关文档/说明,请查看优秀的MDN文章.

有关当前/最新的支持和统计信息,请访问caniuse.com.