Maison > interface Web > Questions et réponses frontales > CSS3 prend-il en charge rgba ?

CSS3 prend-il en charge rgba ?

WBOY
Libérer: 2022-03-29 17:51:21
original
1919 Les gens l'ont consulté

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) ».

CSS3 prend-il en charge rgba ?

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)
Copier après la connexion
  • 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>
Copier après la connexion

Résultats de sortie :

CSS3 prend-il en charge rgba ?

(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!

Étiquettes associées:
css
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal