CSS有计划支持变量吗？

Question

我知道我可以使用框架（http://lesscss.org）来实现这一点，但我想知道纯CSS是否会随时支持这个？

Answer 1

您可能想要了解a Draft Spec for CSS variables。

以下是语法示例：

:root {
  --main-color: #06c;
  --accent-color: #006;
}
/* The rest of the CSS file */
#foo h1 {
  color: var(--main-color);
}

目前还不确定浏览器兼容性。我认为Chrome和Firefox可能会支持它，但我怀疑IE确实如此。

Answer 2

Does CSS have any plans to support variables?

More than plans, it has a W3C candidate recommendation，Chrome here和Firefox here等实施以及Edge实施路线图here。这是一个full support matrix，显示它们目前在FF和Chrome中可用。

google for＆＃34; css变量＆＃34;调出MDN page，其中详细描述了当前的情况。

  

我知道我可以使用框架（http://lesscss.org）来完成这个

真正的CSS变量遵循级联。从这个意义上讲，它们比预处理器（如LESS（预处理器，不是框架）中实现的变量要强大得多。

Answer 3

今天，我们有40％的全球用户支持 CSS变量，您可以在此处查看： http://caniuse.com/#search=variables（又名自定义属性）

Answer 4

可能不是，也可能是因为跨浏览器兼容性。想象一下，在样式表中将颜色设置为变量，使用较旧或较少支持的浏览器的人可能无法读取变量，因此网站不会获得任何颜色！我会使用像SASS这样的预处理器来解决这个问题。