在 Polymer 中编写 CSS 变量默认值的新方法

New way to write CSS variable defaults in Polymer

为什么 Polymer 团队改变了他们在 Polymer 元素中定义默认 CSS 变量值的方式?下面是一个例子:

旧样式

color: var(--my-value,--default-value);

新款

color: var(--my-value,var(--default-value));

自定义 CSS 变量有任何新规范吗?它有什么优势吗?还是完全是其他原因?

来自 Polymer 1.x 的 "old style"(即 var(--a, --b))虽然简洁,但根据 CSS variables spec.

在技术上是无效的

Polymer 2.0-preview notes 表明正确符合规范的动机是支持原生 CSS 属性:

The following invalid styling syntax was previously accepted by the 1.0 custom property shim. In order to support native CSS Custom Properties, rules should be correct to use only natively valid syntax:

  • ...
  • var(--a, --b)
    • Should be var(--a, var(--b))