Maison > interface Web > tutoriel CSS > le corps du texte

Comment faire en sorte que les mots changent de transparence en CSS

青灯夜游
Libérer: 2023-01-11 09:19:52
original
11810 Les gens l'ont consulté

Comment changer la transparence des mots en CSS : 1. Utilisez l'attribut opacity pour ajouter le style "opacity: transparence value;" à l'élément de texte ; 2. Utilisez la fonction rgba() pour ajouter "color:rgba(red , vert, bleu, valeur de transparence);" le style suffit.

Comment faire en sorte que les mots changent de transparence en CSS

L'environnement d'exploitation de ce tutoriel : système Windows7, version CSS3&&HTML5, ordinateur Dell G3.

css permet aux mots de changer la transparence

Méthode 1. Utilisez l'attribut opacité

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<div style="opacity:1;">测试文字</div>
		<div style="opacity:0.5;">测试文字</div>
		<div style="opacity:0.2;">测试文字</div>
	</body>
</html>
Copier après la connexion

Comment faire en sorte que les mots changent de transparence en CSS

Attribut opacité pour définir le niveau de transparence d'un élément.

Syntaxe :

opacity: value;
Copier après la connexion

valeur : Spécifiez l'opacité. De 0,0 (entièrement transparent) à 1,0 (entièrement opaque).

Méthode 2 : Utilisez la fonction rgba()

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<div style="color: rgba(255,0,0,1)">测试文字</div>
		<div style="color: rgba(255,0,0,0.5)">测试文字</div>
		<div style="color: rgba(255,0,0,0.2)">测试文字</div>
	</body>
</html>
Copier après la connexion

Rendu :

Comment faire en sorte que les mots changent de transparence en CSS

La fonction rgba() utilise la superposition du rouge (R), du vert (G), du bleu (B) et de la transparence (A ) pour générer une variété de couleurs.

Grammaire :

rgba(red, green, blue, alpha)
Copier après la connexion

Valeur d'attribut :

Valeur Description
rouge Définissez la valeur rouge, la plage de valeurs est de 0 à 255, vous pouvez également utiliser le pourcentage 0% ~ 100% .
vert Définissez la valeur verte, la plage de valeurs est de 0 à 255, vous pouvez également utiliser le pourcentage de 0 % à 100 %.
bleu Définissez la valeur bleue, 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 transparente) ~ 1 (entièrement opaque)

(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:
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
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!