CSS => Włamania do Internet Explorera

Uwagi

Tych „hacków” można użyć do ukierunkowania określonej przeglądarki / klienta. Można to wykorzystać do obejścia różnic w renderowaniu przez przeglądarkę, stosując style w jednym z wyżej wymienionych opakowań.

Tryb wysokiego kontrastu w przeglądarce Internet Explorer 10 i nowszych

W Internet Explorerze 10+ i Edge Microsoft udostępnia selektor multimediów o -ms-high-contrast , aby odsłonić ustawienie „Wysoki kontrast” w przeglądarce, co pozwala programiście odpowiednio dostosować style strony.

Przełącznik -ms-high-contrast ma 3 stany: active , black-on-white i white-on-black . W IE10 + miał również none stan, ale to nie jest już obsługiwana w brzegiem skierowanym do przodu.

Przykłady

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: black-on-white) {
   .header{
      background: #fff;
      color: #000;
   }
}

Spowoduje to zmianę tła nagłówka na biały i kolor tekstu na czarny, gdy aktywny jest tryb wysokiego kontrastu i jest on w trybie black-on-white .

@media screen and (-ms-high-contrast: white-on-black) {
   .header{
      background: #000;
      color: #fff;
   }
}

Podobnie jak w pierwszym przykładzie, ale powoduje to wybranie tylko stanu white-on-black i odwraca kolory nagłówka na czarne tło z białym tekstem.

Więcej informacji:

Dokumentacja Microsoft na -ms-high-contrast

Tylko Internet Explorer 6 i Internet Explorer 7

Aby kierować reklamy na Internet Explorera 6 i Internet Explorera 7, uruchom swoje właściwości za pomocą * :

.hide-on-ie6-and-ie7 {
    *display : none; // This line is processed only on IE6 and IE7
}

Przedrostki inne niż alfanumeryczne (inne niż łączniki i podkreślenia) są ignorowane w IE6 i IE7, więc ten hack działa dla każdej pary nieokreślonych property: value .

Tylko Internet Explorer 8

Aby kierować na program Internet Explorer 8, umieść selektory w @media \0 screen { } :

@media \0 screen {
    .hide-on-ie8 {
        display : none;
    }
}

Wszystko między @media \0 screen { } jest przetwarzane tylko przez I

Dodanie obsługi Inline Block do IE6 i IE7

display: inline-block;

Właściwość display z wartością inline-block nie jest obsługiwana przez Internet Explorer 6 i 7. Obejściem tego jest:

zoom: 1;
*display: inline;

Właściwość zoom wyzwala funkcję hasLayout elementów i jest dostępna tylko w przeglądarce Internet Explorer. Wyświetlacz *display zapewnia, że niepoprawna właściwość jest wykonywana tylko w przeglądarkach, których dotyczy problem. Inne przeglądarki po prostu zignorują tę regułę.

Modified text is an extract of the original Stack Overflow Documentation

Licencjonowany na podstawie CC BY-SA 3.0

Nie związany z Stack Overflow

CSS
Włamania do Internet Explorera

Szukaj…