IE CSSフィルターをリセットまたはオーバーライドするにはどうすればよいですか？

89

私は独自のMS 'filter'プロパティを使用して、css3 text-shadowおよびbox-shadowと同等の醜くない同等物を作成しています。

この問題にぶつかるまで、私は実際に本当によくやっていた。フィルターを持つ別のdiv内のdivにフィルターを適用すると、フィルター効果が子オブジェクトに結合されるように見えます。

filter：noneを使用してみました。リセットするが喜びはない。「-ms-filter： 'progid：... Glow（）'」、「filter：progid：... Glow（）」、「filter：Glow（）」など、さまざまな構文のバリエーションも試しました。、など

IE8でのテスト

css filter internet-explorer

— SpliFF
ソース

8

これは私にとってはfilter:;

— うまくいき

1

フィルタ：; lessphp cssプリプロセッサでは機能しません、フィルタ：-; します。

— David Meister 2012年

使用しますfilter: ;。これは、IEが有効な値ではないため、プロパティをまとめて削除することを強制すると思います。

— Bhumi Singhal 2013

3

SCSSを使用filter:none;して、構文エラーを回避するために使用する必要がありました。

— Nic Barbier 2013年

95

boolean属性が有効になっていて、falseまたはtrueを 設定できますhttp://msdn.microsoft.com/en-us/library/ms532997%28v=vs.85%29.aspx

例：

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

— el22or
ソース

1

ありがとうございました！これは私には2つうまくいきました。私は消えない厄介な背景スタイルを持っていて、どんなに頑張ってもそれを見つけることができませんでした。

— racl101

ありがとう！ボタンのグラデーションフィルターは、背景画像のある特定のボタンを使用するとうまく機能しません-フィルターは画像に適用されます...

— Adam

魅力のように働いた！ありがとうございました！

— ボグダン2013

20

-ms-filterプロパティは非標準のブラウザ固有のCSSエントリであるため、そのパラメーターを引用符で囲む必要があります。したがって、-ms-filter： "none"は問題なく機能します。

— ピンクダック
ソース

16

これを試して：

フィルター：-;

— ブローザ
ソース

-ms-filter： "progid：DXImageTransform.Microsoft.gradient（enabled = false）";の間、IE7で私のために働きました。しなかった。Thx

— Simon Arnold、

@SimonArnold "-ms-filter"はIE8以降でのみサポートされています。IE7は「filter」属性のみをサポートします。msdn.microsoft.com/en-us/library/ie/ms530752(v=vs.85).aspxを参照してください。

— ヴィー

6

子供を絶対的または相対的に配置することで、ある程度の成功を収めました。これは以前はうまくいかなかったようですが、もっと複雑になると再び壊れる可能性があります

親がフィルターを適用すると、そのすべての子は本質的に内部的にDirectXサーフェスになると思います。テキストを選択することはできますが、遅延します。テキストの選択は、各文字を別々の表面にするハックだと思います。これは、一般的なブラウザ、特にフィルタが非常にバグが多い理由を説明するのに長い道のりをたどる厄介な混乱です。

— SpliFF
ソース

6

HTML5を使用している場合は、使用のルートをたどることができます

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

そしてあなたのCSSで次のようなものを使用してください：

.ie9 .element {filter: none; }

— ジョンC
ソース

1

フィルターを有効/無効にしようとしましたか？

— anddoutoi
ソース

2

動作しません。子から親フィルターを上書きすることはできません。

— SpliFF 2010年

0

最善の方法は、display：inline-blockです（コンテナーにwhite-space：nowrapを適用します）。しかし、それはIE7以下ではうまくいかないようです

— 最高
ソース