Mengapa Kelegapan RGBA Tidak Berfungsi dalam IE8 dan Bagaimana Saya Boleh Membetulkannya?

IE 8 Opacity Illusion: Menyelesaikan Isu Latar Belakang RGBA

Memanipulasi kelegapan latar belakang menggunakan RGBA telah menjadi teknik popular dalam pembangunan web. Walau bagaimanapun, keserasian penyemak imbas boleh menjadi satu cabaran. Soalan ini menangani isu khusus di mana kelegapan RGBA gagal dipaparkan dengan betul dalam Internet Explorer 8.

Masalah:

Apabila cuba menetapkan kelegapan latar belakang

background: rgba(255, 255, 255, 0.3);

Kelegapan yang diingini berkuat kuasa dalam Firefox tetapi kekal tidak kelihatan dalam IE 8.

Penyelesaian:

IE 8 tidak mempunyai sokongan asli untuk kelegapan RGBA. Untuk mensimulasikan kesan ini, penapis kecerunan boleh digunakan. Kuncinya adalah untuk menentukan warna mula dan akhir yang sama, dengan saluran alfa yang dikehendaki ditentukan sebagai nilai pertama dalam kod warna HEX. Berikut ialah CSS yang dipinda:

background: rgba(255, 255, 255, 0.3); /* browsers */
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4cffffff', endColorstr='#4cffffff'); /* IE */

Penyelesaian ini meniru kelegapan RGBA yang diingini, membolehkan reka bentuk anda berfungsi dengan lancar merentas pelayar, termasuk IE 8.

Atas ialah kandungan terperinci Mengapa Kelegapan RGBA Tidak Berfungsi dalam IE8 dan Bagaimana Saya Boleh Membetulkannya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!