为什么我不能在 CSS 变量中使用 rgba？

Question

我正在尝试在 SCSS 文件中创建这个变量。但这不起作用。我哪里做错了？

--orange: #fda63c;
--orange-light: rgba(var(--orange), 0.15);

这也不起作用：

--orange: #fda63c;
background-color: rgba(var(--orange), 0.15);

Answer 1

您将无法将函数传递给rgba，但rgba会接受包含rgb颜色值的变量。

:root {
--orange: 253, 166, 60;
--orange-light: rgba(var(--orange), 0.15);  
}


p {
  color: var(--orange-light);
}

<p>Hello orange world</p>

js小提琴