为什么 Post CSS 变量会将 CSS 中的变量替换为实际值？

Question

将我的 CSS 代码提交到 Post CSS Variables Playground 后，它将我的变量更改为样式表中定义的实际值。出现这种情况有什么具体原因吗？

我还处于学习网络开发的早期阶段，所以如果有些简单的东西我还不明白，请原谅。如果这很重要的话，我目前正在学习 HTML。

我希望变量保留在sylesheet中

Answer 1

当您将带有变量的 CSS 代码提交到 PostCSS Variables Playground 时，它可能会使用旨在将 CSS 变量转换为静态值的插件。这种转变发生是因为：

兼容性：旧版浏览器不支持 CSS 变量。通过将变量替换为实际值，生成的 CSS 就可以与这些浏览器兼容。 性能：在某些情况下，删除变量可以稍微提高性能，因为浏览器在渲染过程中不需要计算变量的值。