<alpha-value>
Le type de donnée CSS <alpha-value>
représente une valeur qui peut être soit un <number>
soit un <percentage>
, et qui définit le canal alpha (alpha channel) ou la transparence d'une couleur.
Syntaxe
La valeur d'un <alpha-value>
s'exprime soit comme un <number>
soit comme un pourcentage
.
Si la valeur est donnée comme un nombre, l'intervalle utile est de 0 (totalement transparent) à 1 (totalement opaque), avec des valeurs décimales possibles entre les deux. Par exemple, 0.5 indique que la couleur de premier plan est utilisée à 50 % et celle d'arrière-plan à 50 %. Les valeurs en dehors de l'intervalle 0 à 1 sont autorisées, mais elles sont écrêtées à 0 ou 1.
Si la valeur alpha est donnée en pourcentage, 0 % correspond à une transparence totale tandis que 100 % indique une opacité totale.
Syntaxe formelle
<alpha-value> =
<number> |
<percentage>
Interpolation
Lorsqu'elles sont animées, les valeurs du type de donnée CSS <alpha-value>
sont interpolées comme des nombres réels à virgule flottante. La vitesse de l'interpolation est déterminée par la fonction de temporisation associée à l'animation.
Exemples
Définir l'opacité de la couleur du texte
La fonction rgb()
accepte une quatrième valeur optionnelle pour spécifier une valeur alpha. L'exemple suivant montre comment appliquer une couleur avec 60 % d'opacité :
/* <rgb()> */
color: rgb(34 12 64 / 60%);
Définir le seuil d'image de forme
Ici, une valeur alpha est utilisée pour déterminer quelles parties d'une image sont considérées comme faisant partie d'une forme :
/* shape-image-threshold */
shape-image-threshold: 70%;
shape-image-threshold: 0.7;
Spécifications
Specification |
---|
CSS Color Module Level 4 # typedef-color-alpha-value |