在 Chrome 29+ 中使用 CSS 变量

我的 Chrome 浏览器刚刚从版本 28 切换到版本 29。切换后，我的 css3 代码在新版本中停止工作，我想知道是否有人知道如何解决该问题，而无需将我的浏览器设置回版本 28？

更新 Chrome 30从 Chrome 29 过渡到 Chrome 30 也杀死了 CSS 变量。这启用实验性 WebKit 功能标志不再是一种选择。

我一直在使用实验性的 WebKit 功能，特别是 CSS 变量。以下功能是我特别想要再次工作的功能：

:root { 
  -webkit-var-Darkest: #3d0305;
  -webkit-var-Lightest: #EDD08C;
  -webkit-var-Light: #a98b46;
  -webkit-var-Cool: #38fcce;
  -webkit-var-Dark: #79161d;

  color: -webkit-var(Darkest);
  border-color: -webkit-var(Darkest);
  background-color: -webkit-var(Light);
}

以前，使用 CSS 变量我所要做的就是启用该标志（参见下图）

那么，读完之后code.google.com https://code.google.com/p/chromium/issues/detail?id=164139在试图找到解决方案时，我发现他们一直计划从“实验性 WebKit 功能”中删除此功能并支持 CSS3 标准，从而消除了-webkit-供应商前缀。

我认为这意味着它是在 Chrome 29 中实现的。因此，将上面的代码更改为以下内容解决了问题：

:root {
  var-Darkest: #3d0305;
  var-Lightest: #EDD08C;
  var-Light: #a98b46;
  var-Cool: #38fcce;
  var-Dark: #79161d;

  color: var(Darkest);
  border-color: var(Darkest);
  background-color: var(Light);
}

更新 Chrome 30在这似乎是一个过渡结束 WebKit 的使用对于 Chromium 的 Blink，有一个需要启用的不同标志 called 启用实验性 Web 平台功能. An 文章位于 chromium.org http://www.chromium.org/blink/runtime-enabled-features有解决方案。

更新 Chrome 34 The CSS 变量规范。 https://drafts.csswg.org/css-variables/又变了。旧代码还存在其他特定问题。我没有更新这个答案，因为这是一个相当不同的问题。请参见这个帖子 https://stackoverflow.com/q/23370966/1992129了解有关该问题的更多信息。