Sök…


Anmärkningar

Dessa "hacks" kan användas för att rikta in sig på en specifik webbläsare / klient. Detta kan användas för att hantera skillnader i webbläsarnas rendering genom att tillämpa stilar i en av de omslag som listas ovan.

Högkontrastläge i Internet Explorer 10 och högre

I Internet Explorer 10+ och Edge tillhandahåller Microsoft media-väljaren med -ms-high-contrast att avslöja inställningen "Hög kontrast" från webbläsaren, vilket gör att programmeraren kan justera webbplatsens stilar i enlighet därmed.

-ms-high-contrast tre tillstånd: active , black-on-white och white-on-black . I IE10 + hade den också ett none tillstånd, men det stöds inte längre i Edge framöver.

exempel

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

Detta kommer att ändra rubrikbakgrunden till vit och textfärgen till svart när högkontrastläget är aktivt och i black-on-white läge.

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

Liknar det första exemplet, men detta väljer specifikt bara white-on-black tillståndet och omvandlar rubrikfärgerna till en svart bakgrund med vit text.


Mer information:

Microsoft-dokumentation-ms-high-contrast

Endast Internet Explorer 6 & Internet Explorer 7

För att rikta in sig på Internet Explorer 6 och Internet Explorer 7, starta dina egenskaper med * :

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

Icke-alfanumeriska prefix (andra än bindestreck och understreck) ignoreras i IE6 och IE7, så det här hacket fungerar för alla obefixade property: value par.

Endast Internet Explorer 8

Om du @media \0 screen { } rikta in sig på Internet Explorer 8 ska du @media \0 screen { } in dina väljare på @media \0 screen { } :

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

Allt mellan @media \0 screen { } behandlas endast av jag

Lägga till Inline Block-stöd till IE6 och IE7

display: inline-block;

display med värdet av inline-block stöds inte av Internet Explorer 6 och 7. En lösning för detta är:

zoom: 1;
*display: inline;

zoom utlöser hasLayout funktionen för element, och den är endast tillgänglig i Internet Explorer. *display ser till att den ogiltiga egenskapen bara körs i de drabbade webbläsarna. Andra webbläsare ignorerar helt enkelt regeln.



Modified text is an extract of the original Stack Overflow Documentation
Licensierat under CC BY-SA 3.0
Inte anslutet till Stack Overflow