Bagaimana untuk membuat perkataan menukar ketelusan dalam css-tutorial css-php.cn

Bagaimana untuk membuat perkataan menukar ketelusan dalam css

青灯夜游

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

asal

11809 orang telah melayarinya

Cara menukar ketelusan teks dalam css: 1. Gunakan atribut opacity untuk menambah gaya "opacity: transparency value;" pada elemen teks; 2. Gunakan fungsi rgba() untuk menambah "color :" ke elemen teks. rgba(merah, hijau, biru, nilai ketelusan);"

Bagaimana untuk membuat perkataan menukar ketelusan dalam css

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi CSS3&&HTML5, komputer Dell G3.

css menukar ketelusan perkataan

Kaedah 1. Gunakan atribut kelegapan

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

Salin selepas log masuk

Bagaimana untuk membuat perkataan menukar ketelusan dalam css

Atribut Opacity menetapkan tahap ketelusan sesuatu elemen.

Sintaks:

opacity: value;

Salin selepas log masuk

nilai: Tentukan kelegapan. Daripada 0.0 (lutsinar sepenuhnya) kepada 1.0 (legap sepenuhnya).

Kaedah 2: Gunakan fungsi 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>

Salin selepas log masuk

Rendering:

Bagaimana untuk membuat perkataan menukar ketelusan dalam css

The Fungsi rgba() menggunakan superposisi merah (R), hijau (G), biru (B), dan ketelusan (A) untuk menjana pelbagai warna.

Sintaks:

rgba(red, green, blue, alpha)

Salin selepas log masuk

Nilai atribut:

值	描述
red	定义红色值，取值范围为 0 ~ 255，也可以使用百分比 0% ~ 100%。
green	定义绿色值，取值范围为 0 ~ 255，也可以使用百分比 0% ~ 100%。
blue	定义蓝色值，取值范围为 0 ~ 255，也可以使用百分比 0% ~ 100%。
alpha - 透明度	定义透明度 0（完全透明） ~ 1（完全不透明）

(Belajar perkongsian video: tutorial video css)

Atas ialah kandungan terperinci Bagaimana untuk membuat perkataan menukar ketelusan dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!