Wie setze ich IE-CSS-Filter zurück oder überschreibe sie?


89

Ich verwende die proprietäre MS-Eigenschaft 'filter', um zu versuchen, ein nicht hässliches Äquivalent zu css3 text-shadow und box-shadow zu erstellen.

Mir ging es wirklich gut, bis ich auf dieses Problem stieß. Wenn ich einen Filter auf ein Div in einem anderen Div anwende, das auch einen Filter hat, werden die Filtereffekte auf das untergeordnete Objekt kombiniert.

Ich habe versucht, Filter zu verwenden: keine; einen Reset machen, aber keine Freude. Ich habe auch verschiedene Variationen der Syntax ausprobiert, z. B. "-ms-filter: 'progid: ... Glow ()'", "filter: progid: ... Glow ()", "filter: Glow ()" , etc..

Testen in IE8


8
Das funktioniert bei mir:filter:;
Web_Designer

1
Filter:; funktioniert nicht mit lessphp css Präprozessor, Filter: -; tut es aber.
David Meister

verwenden filter: ;. Ich denke, dies wird den IE zwingen, die Eigenschaft insgesamt zu entfernen, da es sich nicht um einen gültigen Wert handelt.
Bhumi Singhal

3
Mit SCSS musste ich filter:none;Syntaxfehler vermeiden.
Nic Barbier

Antworten:


95

Es ist ein boolesches Attribut aktiviert , für das Sie false oder true festlegen können. Http://msdn.microsoft.com/en-us/library/ms532997%28v=vs.85%29.aspx

Beispiel:

-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)";

1
Danke dir! Das hat bei mir beiden geklappt. Ich hatte einen nervigen Hintergrundstil, der nicht verschwinden würde und den ich nicht finden konnte, egal wie sehr ich es versuchte.
racl101

Vielen Dank! Verlaufsfilter für Schaltflächen spielen nicht gut mit bestimmten Schaltflächen mit Hintergrundbildern - der Filter kommt über das Bild ...
Adam

Lief wie am Schnürchen! Danke dir!
Bogdan

20

Die Eigenschaft -ms-filter ist ein nicht standardmäßiger, browserspezifischer CSS-Eintrag und erfordert daher, dass sein Parameter in Anführungszeichen gesetzt wird. Also -ms-Filter: "none" wird gut funktionieren.



6

Ich habe einige Erfolge erzielt, indem ich die Kinder absolut oder relativ positioniert habe. Dies schien jedoch nicht früher zu funktionieren, so dass es möglicherweise wieder kaputt geht, wenn ich komplizierter werde

Ich denke, sobald ein Elternteil einen Filter angewendet hat, werden alle seine Kinder im Wesentlichen intern zu DirectX-Oberflächen. Sie können weiterhin Text auswählen, dieser bleibt jedoch zurück. Ich denke, die Textauswahl ist ein Hack, der jeden Buchstaben zu einer separaten Oberfläche macht. Es ist ein beschissenes Durcheinander, das erklärt, warum der Browser im Allgemeinen und die Filter im Besonderen so fehlerhaft sind.


6

Wenn Sie HTML5 verwenden, möchten Sie möglicherweise den Verwendungsweg beschreiten

<!doctype html>
<!--[if lt IE 7 ]> <html lang="en" class="ie6 oldie"> <![endif]-->
<!--[if IE 7 ]>    <html lang="en" class="ie7 oldie"> <![endif]-->
<!--[if IE 8 ]>    <html lang="en" class="ie8 oldie"> <![endif]-->
<!--[if IE 9 ]>    <html lang="en" class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html lang="en" class="gtie9 modern">
<!--<![endif]-->

und in Ihrem CSS verwenden Sie etwas wie:

.ie9 .element {filter: none; }


0

Ich habe festgestellt, dass der beste Weg die Anzeige ist: Inline-Block (Anwenden von Leerzeichen: Nowrap auf den Container). Aber es scheint schlecht mit IE7 und niedriger zu funktionieren

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.