亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

Wie wende ich Transparenz in CSS-Farbvariablen an?
P粉348088995
P粉348088995 2023-08-20 18:51:07
0
1
649
<p>Ich entwerfe eine App in Electron, damit ich auf CSS-Variablen zugreifen kann. Ich habe in <code>vars.css</code> eine Farbvariable definiert: </p> <pre class="brush:css;toolbar:false;">:root { --color: #f0f0f0; } </pre> <p>Ich m?chte diese Farbe in <code>main.css</code> verwenden, aber etwas Transparenz anwenden: </p> <pre class="brush:css;toolbar:false;">#element { Hintergrund: (irgendwie var(--color) verwenden und etwas Transparenz einstellen); } </pre> <p>Wie mache ich das? Ich verwende keinen Pr?prozessor, nur CSS. Ich würde eine reine CSS-Antwort bevorzugen, bin aber auch offen für JavaScript/jQuery-L?sungen. </p> <p>Ich kann <code>Deckkraft</code> nicht verwenden, da ich ein Hintergrundbild verwende, das nicht transparent sein sollte. </p>
P粉348088995
P粉348088995

Antworte allen(1)
P粉458725040

您不能對(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>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage