Несколько фильтров CSS в IE

Мне просто интересно, что в IE можно использовать два разных фильтра, используя CSS. Поэтому мне нужно использовать прозрачный PNG, а также некоторую непрозрачность для div. Можно ли использовать оба из них?

Моя строка прозрачного создателя выглядит так:

li.item .item-texture {
   background: none transparent scroll repeat 0% 0% !important; 
   filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/ie/articles/item-content-hov.png', sizingMethod='scale') !important;
}

Я попытался добавить еще одну строку (filter: alpha(opacity=50);) и отдельные фильтры с запятой (.. 'scale') !important, alpha(opacity=50);), но это было бесполезно.

Ответы

Ответ 1

Не может быть более одного свойства фильтра, поскольку IE будет использовать только последний.

ПРИМЕЧАНИЕ. Поскольку это похоже на получение нескольких голосов, я хотел бы пояснить, что это не означает, что вы не можете применять несколько фильтров, просто вы можете использовать только 1 filter имущество. Если вы попытаетесь применить несколько фильтров и разделить их на несколько свойств, вступает в силу только последний.

В соответствии со следующей статьей из MSDN они разделяются не запятой, а пробелом: http://msdn.microsoft.com/en-us/library/ms532847(v=vs.85).aspx

Также обратите внимание, что некоторые фильтры IE (включая альфа) требуют, чтобы элемент имел макет для правильного применения: http://www.satzansatz.de/cssd/onhavinglayout.html

Ответ 2

Извините, но выбранный выше ответ неверен. Вы можете применять несколько фильтров в IE, но их нужно разделять одним или несколькими пробелами.

Запятая перед пробелами также будет работать, но только если она следует за закрывающей скобкой. Поэтому фильтры IE 4.0 без параметров, таких как gray, не работают в этом случае. Лучше всего придерживаться пространств только как разделитель.

Если вы перейдете к приведенной выше ссылке: http://msdn.microsoft.com/en-us/library/ms532847 (v = vs .85)).aspx и нажмите следующую ссылку примера (в IE, конечно), вы увидите, что и поворот, и размытие применяется ко второму изображению. Из "источника просмотра" тег изображения:

<img id=image2 src="/workshop/samples/author/dhtml/graphics/sample.jpg" 
     style="filter:progid:DXImageTransform.Microsoft.Blur(strength=50), 
                   progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)"
     height="165px" width="256px" border="0" alt="ocean beach">

Я несколько успешно смоделировал "распространение" теневой коробки в IE7 и 8 (хотя успех зависит от того, насколько приемлемым вы считаете это выглядит), используя:

filter: progid:DXImageTransform.Microsoft.Shadow(Color=#c5c1ae, Strength=10, Direction=0)
        progid:DXImageTransform.Microsoft.Shadow(Color=#c5c1ae, Strength=10, Direction=90)
        progid:DXImageTransform.Microsoft.Shadow(Color=#c5c1ae, Strength=10, Direction=180)
        progid:DXImageTransform.Microsoft.Shadow(Color=#c5c1ae, Strength=10, Direction=270);

так что тень распространяется со всех сторон div. Я также комбинировал тени на div, которые содержат градиенты. Однако это не все происходит без собственной опасности. В приведенном выше примере тени имеют макет, и вам необходимо настроить поля, чтобы они соответствовали их размеру. Кроме того, при IE, являющемся IE, комбинации некоторых из этих фильтров могут иметь непреднамеренные последствия, что приводит к разработке обходных решений, отказа от подходов и вытягиванию одного волоса.

В ваших исходных примерах в вашем вопросе, если вы перечислите более одного фильтра, предыдущий будет переопределяться следующим, как и любое другое свойство CSS. В вашем втором примере "! Important" должен быть полностью в конце стиля, или весь блок CSS отбрасывается, поскольку он неверно отформатирован. (На самом деле, важно, чтобы все было выброшено полностью. Единственная причина, по которой вам когда-либо понадобится использовать его, - это разработка стороннего кода и защита ваших тегов от другого важного разработчика, над которым у вас нет контроля Если ваш стиль непреднамеренно переопределен, вам потребуется более конкретное объявление.)

Ответ 3

Запятая игнорируется. Для вставки нескольких фильтров вам потребуется пробел или новая строка.

progid:xxx progid:yyy / works

progid:xxx, progid:yyy / works

progid:xxx  
progid:yyy / works

progid:xxx,progid:yyy / will not work