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

Comment appliquer la transparence dans la variable de couleur CSS??
P粉348088995
P粉348088995 2023-08-20 18:51:07
0
1
685
<p>Je con?ois une application en électronique pour pouvoir accéder aux variables CSS. J'ai défini une variable de couleur dans <code>vars.css</code>?: </p> <pre class="brush:css;toolbar:false;">:root { --couleur?: #f0f0f0?; } ≪/pré> <p>Je souhaite utiliser cette couleur dans <code>main.css</code> mais appliquer une certaine transparence?: </p> <pre class="brush:css;toolbar:false;">#element { background: (utilisez d'une manière ou d'une autre var(--color) et définissez une certaine transparence) ; } ≪/pré> <p>Comment puis-je procéder?? Je n'utilise aucun préprocesseur, juste du CSS. Je préférerais une réponse CSS pure, mais je suis également ouvert aux solutions JavaScript/jQuery. </p> <p>Je ne peux pas utiliser <code>opacity</code> car j'utilise une image d'arrière-plan qui ne devrait pas être transparente. </p>
P粉348088995
P粉348088995

répondre à tous(1)
P粉458725040

Vous ne pouvez pas appliquer un canal alpha aux valeurs de couleur existantes. Autrement dit, vous ne pouvez pas ajouter un composant alpha à une valeur hexadécimale existante (par exemple #f0f0f0) et utiliser la valeur résultante avec un autre attribut.

Cependant, la propriété personnalisée vous permet de convertir la valeur hexadécimale en triplet RVB à utiliser avec la fonction rgba()一起使用,將該值存儲(chǔ)在自定義屬性中(包括逗號(hào)!),使用var()將該值替換為具有所需alpha值的rgba() et cela fonctionnera correctement?:

: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è),說(shuō)明您的瀏覽器支持自定義屬性。</p>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal