So ändern Sie die Transparenz von Wörtern in CSS-CSS-Tutorial-php.cn

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

青灯夜游

Freigeben： 2023-01-11 09:19:52

Original

11810 Leute haben es durchsucht

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>

Nach dem Login kopieren

Wert: Deckkraft angeben. Von 0,0 (vollständig transparent) bis 1,0 (vollständig undurchsichtig).

Methode 2: Verwenden Sie die Funktion rgba()

opacity: value;

Nach dem Login kopieren

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>

Nach dem Login kopieren

Attributwert:

Wert

Beschreibung So ä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!