W3C CSS 工作组于4月10日发布了 CSS Variables Module Level 1 首个草案。CSS Variables 是什么呢？很明显，Variables 是变量，CSS Variables 就是 CSS 变量。

只要有点开发经验的人都知道定义变量是非常有用的，所以在 CSS 中如果在样式表中经常使用某个值（比如某个颜色或某种字体），可以将其定义为变量，修改样式表时只需更改该变量的值，就更新整个样式表，而无需逐个更改每个样式规则。蓝狮官网

CSS Variables 的定义必须以“var-”开头，后面直接跟变量名，然后是属性值，如“var-fontColor:#333”，“fontColor”就是变量，可以在需要的时候以“var(fontColor)”引用。如：

:root {
var-fontColor:#333;
}
body {
color:var(fontColor);
}
由于变量名可以任意命名，所以如果您根据具体情况命名的话，蓝狮注册登陆那么样式表就会显得更有”语义”，就更容易阅读。

如果一个变量的属性被声明多次，则会根据 CSS 选择器的权限对应应用。如：

:root { var-color:blue;}
div { var-color:green;}

alert { var-color:red;}

• { color:var(color);}

我继承根元素，是蓝色的 我应用div规则，是绿色的 我应用 #alert 规则，是红色的

因为继承 alert，所以我也是红色

更多关于 CSS Variables 的介绍你可以查看官方草案：http://www.w3.org/TR/css-variables/。由于还是草案，所有规则都有可能更改或替换，您也可以提交关于功能和语法上的反馈。有兴趣的话多注意官方的消息吧。

标签：W3C