Kesan Kabur iOS 7 dengan CSS: Pandangan Lebih Dekat
IOS 7 Apple memperkenalkan kesan tindanan kabur yang menarik secara visual. Walaupun ia kelihatan seperti perkara mudah ketelusan, kesan ini melibatkan lebih daripada apa yang dilihat.
Soalan: Bagaimanakah kita boleh meniru kesan ini menggunakan CSS dan, jika perlu, JavaScript?
Jawapan:
CSS 3 menawarkan penyelesaian untuk mencapai kesan ini:
<code class="css">#myDiv { -webkit-filter: blur(20px); -moz-filter: blur(20px); -o-filter: blur(20px); -ms-filter: blur(20px); filter: blur(20px); opacity: 0.4; }</code>
Penapis blur() menambah kesan kabur pada elemen, manakala sifat kelegapan mengawal ketelusan. Untuk memperhalusi kesan, percubaan dengan nilai yang berbeza untuk blur() dan kelegapan.
Contoh:
Terokai contoh langsung kod ini dalam tindakan di JSFiddle.
Atas ialah kandungan terperinci Bagaimana untuk Meniru Kesan Kabur iOS 7 Menggunakan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!