带变量的RGBA

Question

免责声明

我已经看过this post，但在我的浏览器Chrome上不起作用。而且我不使用任何预处理器。

我想让背景颜色变得更不透明，但是要使用颜色变量，而不是十六进制甚至RGB值。我该怎么做？

Answer 1

解决方案是进行简单的“破解”，并使用before选择器将其设置为不透明且不影响整个内容。

.container:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    background-color: var(--color);
    opacity: 0.3;
}