CSS var() 回退在不受支持的浏览器中是否有效？

Question

这些天我在使用 CSS 变量，所以我想到了一件事，我想知道 如果我为 CSS var() 函数设置后备，这个后备如何在 不完全支持 CSS var 的旧浏览器 中工作。 它是否会被应用或被视为未知的 CSS 功能？

长话短说，现在我为属性写了两行 CSS，如下所示：

:root{
   --box-height: 350px;
}

.box{
   height: 350px; // FALLBACK for older browsers.
   height: var(--box-height);
}

我的意图是为旧浏览器提供回退，但如果我这样写就可以了：

:root{
   --box-height: 350px;
}

.box{
   height: var(--box-height, 350px); // Does it work in older browsers really?
}

它是否适用于旧版浏览器？没有关于我在说什么的透明文档你的想法是什么？

Answer 1

Will it work in older browsers or no?

不，不会。如果浏览器无法识别 var() 则无法考虑您在此处定义的回退值。整个值将无效。

如果你想考虑旧浏览器，你应该坚持你的第一个语法。

Does CSS var() fallback work in unsupported browsers?