Heim >Web-Frontend >CSS-Tutorial >So ändern Sie die Transparenz von Wörtern in CSS

So ändern Sie die Transparenz von Wörtern in CSS

青灯夜游
青灯夜游Original
2021-09-13 17:05:0811876Durchsuche

So ändern Sie die Transparenz von Wörtern in CSS: 1. Verwenden Sie das opacity-Attribut, um dem Textelement den Stil „opacity:transparency value;“ hinzuzufügen , Grün, Blau, Transparenzwert);“-Stil ist ausreichend.

So ändern Sie die Transparenz von Wörtern in CSS

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer. Mit CSS können Wörter ihre Transparenz ändern.

Syntax:

<!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>
Wert: Deckkraft angeben. Von 0,0 (vollständig transparent) bis 1,0 (vollständig undurchsichtig).

Methode 2: Verwenden Sie die Funktion rgba()

opacity: value;
Rendering:

So ändern Sie die Transparenz von Wörtern in CSS

Die Funktion rgba() verwendet die Überlagerung von Rot (R), Grün (G), Blau (B) und Transparenz (A ), um eine Vielzahl von Farben zu erzeugen.

Syntax:

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

Attributwert:


Wert

BeschreibungSo ändern Sie die Transparenz von Wörtern in CSS

rot

Definieren Sie den roten Wert, der Wertebereich liegt zwischen 0 und 255 Verwenden Sie auch den Prozentsatz 0 % ~ 100 % .

Definieren Sie den Grünwert. Der Wertebereich liegt zwischen 0 und 255. Sie können auch den Prozentsatz zwischen 0 und 100 % verwenden. Definieren Sie den Blauwert. Der Wertebereich liegt zwischen 0 und 255. Sie können auch den Prozentsatz zwischen 0 und 100 % verwenden. Definieren Sie Transparenz 0 (vollständig transparent) ~ 1 (vollständig undurchsichtig) CSS-Video-Tutorial
Grün
blau
alpha – Transparenz
(Lernvideo-Sharing: )

Das obige ist der detaillierte Inhalt vonSo ändern Sie die Transparenz von Wörtern in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn