Как сбросить или переопределить фильтры IE CSS?

Я использую свойство proprietry MS 'filter', чтобы попытаться создать некрасивый эквивалент CSS3 text-shadow и box-shadow;

Я действительно делал очень хорошо, пока не столкнулся с этой проблемой. Похоже, когда я применяю фильтр к div внутри другого div, который также имеет фильтр, эффекты фильтра в конечном итоге объединяются на дочернем объекте.

Я не могу объяснить это намного лучше, чем это, вот демонстрация: http://cableflow.dev.arc.net.au/test/filters.html

Я пробовал использовать фильтр: нет; для сброса, но без радости. Я также пробовал разные варианты синтаксиса, то есть "- ms-filter: 'progid:...Glow ()'", " фильтр: progid:...Glow ()", "filter: Glow ()" и др..

тестирование в IE8

7 ответов


существует логический атрибут включено, для чего вы можете установить false или правда http://msdn.microsoft.com/en-us/library/ms532997%28v=vs.85%29.aspx

пример:

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

свойство-ms-filter является нестандартной, специфичной для браузера записью CSS и как таковое требует, чтобы его параметр был заключен в кавычки. So-ms-filter:" none " будет работать нормально.


попробуйте это:

фильтр: -;


У меня был некоторый успех, позиционируя детей абсолютными или относительными. Это, казалось, не работало раньше, хотя так что он может сломаться снова, как только я усложню

Я думаю, что как только у родителя есть фильтр, все его дети по существу становятся поверхностями directx внутри. Вы все еще можете выбрать текст, но он отстает. Я думаю, что выбор текста-это хак, который делает каждую букву отдельной поверхностью. Это дерьмовый беспорядок, который проходит долгий путь к объяснению, почему браузер вообще и фильтры, в частности, так глючат.


Если вы используете 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; }

вы пытались включение/отключение фильтр(ы)?


Я нашел лучший способ-display:inline-block (применение пробела: nowrap к контейнеру). Но, похоже, плохо работает с IE7 и ниже