您不能對(duì)現(xiàn)有的顏色值應(yīng)用alpha通道。也就是說,您不能對(duì)現(xiàn)有的十六進(jìn)制值(例如#f0f0f0
)添加alpha分量,并將結(jié)果值與另一個(gè)屬性一起使用。
然而,自定義屬性允許您將十六進(jìn)制值轉(zhuǎn)換為RGB三元組,以便與rgba()
一起使用,將該值存儲(chǔ)在自定義屬性中(包括逗號(hào)?。?,使用var()
將該值替換為具有所需alpha值的rgba()
函數(shù),它將正常工作:
:root { /* #f0f0f0轉(zhuǎn)換為十進(jìn)制RGB */ --color: 240, 240, 240; } body { color: #000; background-color: #000; } #element { background-color: rgba(var(--color), 0.8); }
<p id="element">如果您能看到這個(gè),說明您的瀏覽器支持自定義屬性。</p>