现在可以使用自定义属性:
.brown { --rgb: 118, 76, 41; }.green { --rgb: 51, 91, 11; }a { display: block; position: relative; }div { position: absolute; bottom: 0; background-color: rgba(var(--rgb), 0.8); }a:hover div { background-color: rgba(var(--rgb), 1); }如果自定义属性不是一个选项,请参见下面的原始答案。
不幸的是,不,您必须为每个单独的类再次指定红色,绿色和蓝色值:
a { display: block; position: relative; }.brown { position: absolute; bottom: 0; background-color: rgba(118, 76, 41, 0.8); }a:hover .brown { background-color: rgba(118, 76, 41, 1); }.green { position: absolute; bottom: 0; background-color: rgba(51, 91, 11, 0.8); }a:hover .green { background-color: rgba(51, 91, 11, 1); }您只能将
inherit关键字单独用作属性的值,即使这样,
inherit此处也不适合使用。



