Rumah >hujung hadapan web >tutorial css >Bagaimanakah Anda Boleh Mencapai Skala Kelabu Imej Silang Pelayar dengan Pertimbangan IE10?

Bagaimanakah Anda Boleh Mencapai Skala Kelabu Imej Silang Pelayar dengan Pertimbangan IE10?

Mary-Kate Olsen
Mary-Kate Olsenasal
2024-10-28 13:33:30903semak imbas

How Can You Achieve Cross-Browser Image Grayscale with IE10 Considerations?

Skala Kelabu Imej Penyemak Imbas Rentas dengan Pertimbangan IE10

Internet Explorer 9 dan penyemak imbas terdahulu menyokong penapis skala kelabu melalui penapis DX. Walau bagaimanapun, IE10 memberikan cabaran unik kerana kekurangan sokongan penapis DX.

Penyelesaian Skala Kelabu IE10

Untuk mencapai kesan skala kelabu yang diingini dalam IE10, anda boleh menggunakan Tindanan SVG. Berikut ialah contoh:

<code class="css">img.grayscale:hover {
    filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0'/></filter></svg>#grayscale");
}</code>

Sumber Tambahan

  • [Skala Kelabu Imej Silang Penyemak Imbas dengan CSS](http://www.karlhorky.com/ 2012/06/cross-browser-image-grayscale-with-css.html)
  • [Kesan Penapis SVG dalam IE10](http://blogs.msdn.com/b/ie/archive/2011/ 10/14/svg-filter-effects-in-ie10.aspx)

Atas ialah kandungan terperinci Bagaimanakah Anda Boleh Mencapai Skala Kelabu Imej Silang Pelayar dengan Pertimbangan IE10?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn