[CSS] .png w Internet Explorer

HTML to podstawy w dziedzinie tworzenia stron WWW, Style CSS warto opanować, bowiem za ich pomocą można dostosować odpowiednio wygląd swojej witryny WWW. Zagłębiamy się dalej i udostępniamy w tym forum możliwość zadawania pytań o JavaScript.
ODPOWIEDZ
Louner
Nowy
Nowy
Posty: 89
Rejestracja: czw lut 03, 2005 6:20 pm
Kontakt:

[CSS] .png w Internet Explorer

Post autor: Louner »

Znalazłem pewien sposób na wyświetlanie .png bez tej niebieskiej ramki w Internet Explorer'ze. :) Dokładnie ten filtr w css:

Kod: Zaznacz cały

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./gfx/belka.png', sizingMethod='image');
Mam pytanie.. Jak mogę sprawić, żeby dla strony otwieranej w Internet Explorer elementy strony odwoływały się do tej klasy, a przy innych przeglądarkach do innej?

To jest mój kod css.

Kod: Zaznacz cały

DIV.tekst_lewy_tytul
{
        width:192px;
        height:30px;
        margin:auto;
        z-index:2;
        background:url('./gfx/belka.png') no-repeat 50% 50%;
        font-family:garamond,arial,hevletica,verdana,tahoma;
        font-size:14pt;
        font-weight:bold;
        padding:3px;
        padding-left:10px;
        filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./gfx/belka.png', sizingMethod='image');
}
Chciałbym, żeby przy IE nie była brana pod uwagę linia:

Kod: Zaznacz cały

        background:url('./gfx/belka.png') no-repeat 50% 50%;
A ta linia:

Kod: Zaznacz cały

        filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./gfx/belka.png', sizingMethod='image');

I odwrotnie w innych przeglądarkach. Czy to możliwe?
Stig
Administrator
Posty: 938
Rejestracja: pn paź 04, 2004 10:52 am

Re: [CSS] .png w Internet Explorer

Post autor: Stig »

Oczywiście, że można - wystarczy skorzystać z selektorów, które nie są obsługiwane przez poszczególne przeglądarki.

W pierwszej kolejności badzIEwie - można posłużyć się star-hack'iem, który jako błędny zapis nie będzie interpretowany przez nowoczesne przeglądarki - przykład:

Kod: Zaznacz cały

* html div.tekst_lewy_tytul {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./gfx/belka.png', sizingMethod='image'); 
}
W przypadku nowoczesnych przeglądarek można skorzystać z child selector, który choć poprawny nie jest interpretowany przez produkt Micro$oft'u - przykład:

Kod: Zaznacz cały

body>div.tekst_lewy_tytul {
background:url('./gfx/belka.png') no-repeat 50% 50%;
}
Jeżeli chciałbyś szerzej wprowadzać takie różnice to dla zachowania porządku proponowałbym rozważyć użycie komentarzy warunkowych.
Louner
Nowy
Nowy
Posty: 89
Rejestracja: czw lut 03, 2005 6:20 pm
Kontakt:

Re: [CSS] .png w Internet Explorer

Post autor: Louner »

Działa pięknie. :D Bardzo dziękuję. To już drugi raz kiedy mi pomogłeś. ;)
ODPOWIEDZ