CSS
Internet Explorer-hackar
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 på -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.