Anwenden von Graustufenfiltern in Internet Explorer 10
Internet Explorer 10 stellt eine Herausforderung für die Anwendung von Graustufenfiltern mit herkömmlichen CSS-Methoden dar. Im Gegensatz zu früheren IE-Versionen werden DX-Filter und vorangestellte Graustufenfilter nicht mehr unterstützt.
Lösung: SVG-Overlay
Für Graustufenbilder in IE10 können Sie ein SVG verwenden Überlagerung. Dazu gehört die Verwendung eines SVG-Filters mit einer Matrix, die das Bild in Graustufen umwandelt.
CSS-Code:
<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>
Zusätzliche Überlegungen:
Beispiel:
<code class="css">svg { background:url(http://4.bp.blogspot.com/-IzPWLqY4gJ0/T01CPzNb1KI/AAAAAAAACgA/_8uyj68QhFE/s400/a2cf7051-5952-4b39-aca3-4481976cb242.jpg); }</code>
Das obige ist der detaillierte Inhalt vonWie wende ich Graustufenfilter in Internet Explorer 10 an?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!