IE11 中的 CSS hsl 计算错误

Question

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

我想在 hsl 值中使用 calc 和 CSS 自定义属性(css 变量)。 而且我不想使用 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 does not support calc() on color functions. Example: color: hsl(calc(60 * 2), 100%, 50%).

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

在此上下文中，您需要抓取对 calc() 的要求