Comment pouvez-vous obtenir des niveaux de gris d'image multi-navigateurs avec les considérations d'IE10 ?

Niveaux de gris d'image multi-navigateurs avec considérations sur IE10

Internet Explorer 9 et les navigateurs antérieurs prennent en charge les filtres en niveaux de gris via les filtres DX. Cependant, IE10 présente un défi unique en raison de son manque de prise en charge des filtres DX.

Solution d'échelle de gris IE10

Pour obtenir l'effet d'échelle de gris souhaité dans IE10, vous pouvez utiliser un Superposition SVG. Voici un exemple :

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

Ressources supplémentaires

• [Niveaux de gris d'image multi-navigateurs avec CSS](http://www.karlhorky.com/ 2012/06/cross-browser-image-grayscale-with-css.html)
• [Effets de filtre SVG dans IE10](http://blogs.msdn.com/b/ie/archive/2011/ 14/10/svg-filter-effects-in-ie10.aspx)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!