为什么我不能在 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>

jsFiddle