IE11 中的 CSS hsl calc 错误

Question

IE11 似乎不计算 hsl(31, 86, calc(54% - 10%))，但所有其他浏览器都可以。

我想在带有 CSS 自定义属性（css 变量）的 hsl 值中使用 calc。 而且我不想使用 SASS 函数。 （我使用这个 polyfill 为 IE11 使用 css 变量。 https://github.com/jhildenbiddle/css-vars-ponyfill)

:root{
  --accent-color-h: 31;
  --accent-color-s: 86%;
  --accent-color-l: 54%;
}
.darken .accent-color{
  background-color: hsl(var(--accent-color-h), var(--accent-color-s), calc(var(--accent-color-l) - 10%));
  }

Answer 1

IE 不支持颜色函数的 calc()。示例：颜色：hsl(calc(60 * 2), 100%, 50%)。

来源：https://caniuse.com/#feat=calc

在这种情况下，您需要消除对 calc() 的要求