Sass 中 rgba(var(--color)) 无效的原因是什么？

sass 中 rgba(var(--color)) 无效的原因

在 sass 中使用 rgba(var(--color)) 的时候，可能会遇到在元素上没有生效的情况。

问题原因：

正如问题的提示中提到的，最终编译成的 css 代码为 rgba(var(--color_theme, #409eff), 0.8)。但是，rgba 函数需要传入 10 进制的颜色值才能生效，而 var(--color_theme, #409eff) 返回的是 16 进制颜色值。

要解决此问题，需要将 var(--color_theme) 转换 10 进制颜色值，可以使用 rgb() 函数：

$themecolor: rgba(rgb(var(--color_theme, #409eff)), 0.8);

这样，编译后的 css 代码将为：

rgba(64, 158, 255, 0.8);

现在，rgba() 函数能够正确解析 10 进制颜色值，元素将呈现预期的透明度。

以上就是Sass 中 rgba(var(--color)) 无效的原因是什么？的详细内容，更多请关注其它相关文章！