Wiele filtrów CSS w IE

Question

Zastanawiam się, że możliwe jest zastosowanie dwóch różnych filtrów w IE przy użyciu CSS. Potrzebuję więc przezroczystego PNG i pewnej nieprzezroczystości do div. Czy można korzystać z obu?

Moja linia przezroczysty-maker wygląda następująco:

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; 
} 

Próbowałem dodać jeszcze jedną linię (filter: alpha(opacity=50);) oraz oddzielne filtry z przecinkiem (.. 'scale') !important, alpha(opacity=50);), ale to było bezużyteczne.

Answer 1

Nie może być więcej niż jedna właściwość filtru, ponieważ IE weźmie tylko ostatni efekt.

UWAGA: Ponieważ to wydaje się być coraz kilka dół głosów chciałem wyjaśnić, że to nie znaczy, że nie można zastosować kilka filtrów, tak, że można użyć tylko 1 filterwłasność. Jeśli spróbujesz zastosować wiele filtrów i oddzielić je na wiele właściwości, tylko ostatni zacznie obowiązywać.

Według poniższego artykułu z MSDN, nie są one oddzielone przecinkiem ale przestrzeni: http://msdn.microsoft.com/en-us/library/ms532847(v=vs.85).aspx

Należy również zauważyć, że niektóre filtry IE (alfa zestawie) wymagają element mieć układ, aby być stosowane prawidłowo : http://www.satzansatz.de/cssd/onhavinglayout.html

Answer 2

Przepraszamy, ale wybrana odpowiedź powyżej jest nieprawidłowa. Możesz może zastosować wiele filtrów w IE, ale muszą one być oddzielone przez jedną lub więcej przestrzeni.

Przecinek, zanim spacje również będą działały, ale tylko wtedy, gdy podąża za nawiasem zamykającym. Dlatego filtry IE 4.0 bez parametrów takich jak gray nie działają w tym przypadku. Najlepiej trzymać się spacji tylko jako separatora.

Jeśli przejdziesz do linku podanego powyżej: http://msdn.microsoft.com/en-us/library/ms532847(v=vs.85).aspx i klikniesz na following example link (oczywiście w IE), zobaczysz, że zarówno obrót, jak i rozmycie są stosowane do drugiego obrazu. Od „View Source”, znacznik zdjęcie:

<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"> 

mam nieco powodzeniem symulowane z „rozłożone” z cienia skrzynki w IE7 i 8 (choć sukces zależy od zaakceptowania uważasz to wygląda), używając:

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); 

tak, że cień rozprzestrzenia się ze wszystkich stron elementu div. Połączyłem także cienie na elementach div zawierających gradienty. Jednak nie wszystko to odbywa się bez własnego zagrożenia. W powyższym przypadku cienie mają układ i trzeba dostosować marginesy, aby dostosować ich rozmiar. Ponadto, ponieważ IE jest IE, kombinacje niektórych z tych filtrów mogą mieć niezamierzone konsekwencje, prowadzące do opracowania obejść, porzucenia podejścia i wyrywania włosów.

W swoich oryginalnych przykładach w pytaniu, jeśli wyświetlisz więcej niż jeden filtr, poprzedni zostanie zastąpiony przez następny, tak jak każda inna właściwość CSS. W twoim drugim przykładzie "! Important" musi być całkowicie na końcu stylu lub cały blok CSS jest odrzucany, ponieważ jest źle sformatowany. (Właściwie, ważne !, należy całkowicie go wyrzucić. Jedynym powodem, dla którego kiedykolwiek musiałbyś go użyć, jest opracowanie kodu strony trzeciej i ochrona tagów przed innym, ważnym programistą, nad którym nie masz kontroli .Jeśli Twój styl został przypadkowo nadpisany, potrzebujesz bardziej szczegółowej deklaracji.)

Answer 3

Przecinek zostanie zignorowany. Do wklejenia wielu filtrów potrzebny jest biały znak lub nowa linia.

progid:xxx progid:yyy/works 

progid:xxx, progid:yyy/works 

progid:xxx 
progid:yyy/works 

progid:xxx,progid:yyy/will not work