Maison > Article > interface Web > CSS3 prend-il en charge rgba ?
CSS3 prend-il en charge rgba ?
- WBOYoriginal
- 2022-03-29 17:51:211863parcourir
css3 prend en charge rgba ; la fonction rgba() est une fonction en CSS3 qui utilise la superposition du rouge, du vert, du bleu et de la transparence pour générer une variété de couleurs. La plage de valeurs du rouge, du vert et du bleu est de "0 à". 255 » ou « 0 % à 100 % », et la plage de valeurs de transparence est de 0 à 1, et la syntaxe est « rgba (rouge, vert, bleu, transparence) ».
L'environnement d'exploitation de ce tutoriel : système Windows 10, version CSS3&&HTML5, ordinateur Dell G3.
Est-ce que CSS3 prend en charge rgba ?
La fonction rgba() utilise la superposition du rouge (R), du vert (G), du bleu (B) et de la transparence (A) pour générer différentes couleurs. Version prise en charge : CSS3
RGBA signifie rouge, vert, bleu, transparence (anglais : Red, Green, Blue, Alpha).
Les couleurs en CSS peuvent être définies de trois manières : en utilisant des méthodes de couleur (RVB, RGBA, HSL, HSLA), des valeurs de couleur hexadécimales et des noms de couleurs prédéfinis.
Syntaxe CSS
rgba(red, green, blue, alpha)
red définit la valeur rouge, la plage de valeurs est de 0 à 255, vous pouvez également utiliser le pourcentage de 0% à 100%.
green définit la valeur verte, la plage de valeurs est de 0 à 255, vous pouvez également utiliser le pourcentage de 0 à 100 %.
blue définit la valeur du bleu, la plage de valeurs est de 0 à 255, vous pouvez également utiliser le pourcentage de 0 % à 100 %.
alpha - Transparence Définir la transparence 0 (entièrement transparent) ~ 1 (entièrement opaque)
Les exemples sont les suivants :
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<style>
#p1 {background-color:rgba(255,0,0,0.3);}
#p2 {background-color:rgba(0,255,0,0.3);}
#p3 {background-color:rgba(0,0,255,0.3);}
#p4 {background-color:rgba(192,192,192,0.3);}
#p5 {background-color:rgba(255,255,0,0.3);}
#p6 {background-color:rgba(255,0,255,0.3);}
</style>
</head>
<body>
<p>RGB 颜色，并使用透明度:</p>
<p id="p1">红色</p>
<p id="p2">绿色</p>
<p id="p3">蓝色</p>
<p id="p4">灰色</p>
<p id="p5">黄色</p>
<p id="p6">樱桃色</p>
</body>
</html>Résultats de sortie :
(Partage vidéo d'apprentissage : tutoriel vidéo CSS )
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!