Rumah > Artikel > hujung hadapan web > Bagaimana untuk membuat perkataan menukar ketelusan dalam css
Bagaimana untuk membuat perkataan menukar ketelusan dalam css
- 青灯夜游asal
- 2021-09-13 17:05:0811827semak imbas
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);"
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>
Atribut Opacity menetapkan tahap ketelusan sesuatu elemen.
Sintaks:
opacity: value;
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>
Rendering:
The Fungsi rgba() menggunakan superposisi merah (R), hijau (G), biru (B), dan ketelusan (A) untuk menjana pelbagai warna.
Sintaks:
rgba(red, green, blue, alpha)
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!