Как сбросить или переопределения фильтров, т. е. в 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:...Свечение ()", " фильтр: свечение ()" и др..

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

7 88

7 ответов:

есть логический атрибут включено, для которого можно установить ложные или правда 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; }

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

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