css - IE 对 CSS 变量的支持有什么技巧吗？

Question

我将 CSS 变量用于主题颜色和主题背景，但我的代码在 IE 上不起作用。IE 对 CSS 变量的支持有什么技巧吗？

/* Declaring variable*/
:root {
  --theme-color: #323232;
  --theme-bg-color: #af0069;
}

/* Using variable */
.btn {
  background: var(--theme-bg-color);
  color: var(--theme-color);
}

Answer 1

仅在这种情况下可用的低调解决方案：

完成您的项目，然后复制您的 CSS 文件，查找并替换所有您var(--theme-bg-color);的 's 与受人尊敬的颜色：#323232;.

这将导致您必须在每次迭代中重做此步骤，但将保证一个完全受支持的网站，即使在 Internet Explorer 中也是如此。

Answer 2

IE 不支持变量。但是您可以使用 CSS 预处理器，例如 LESS 或 SASS。

@themeColor: #323232;
@themeBgColor: #af0069;

.btn {
    background: @themeBgColor;
    color: @themeColor;
}