Wie kann ich CSS-Hacks verwenden, um nur Internet Explorer 11 anzusprechen und zu formatieren?-CSS-Tutorial-php.cn

Wie kann ich CSS-Hacks verwenden, um nur Internet Explorer 11 anzusprechen und zu formatieren?

Patricia Arquette

Freigeben： 2024-12-04 18:55:16

Original

286 Leute haben es durchsucht

How Can I Use CSS Hacks to Target and Style Only Internet Explorer 11?

CSS-Hacks für IE 11

Um Rendering-Probleme in IE 11 zu beheben, ist es notwendig, CSS-Filter zu verwenden, die nur dieser Browser analysieren kann .

Microsoft-spezifisches CSS Regeln

Verwenden Sie eine Kombination aus Microsoft-spezifischen CSS-Regeln, um auf IE11 abzuzielen:

@media all and (-ms-high-contrast:none)
{
    /* IE10 styles */
    .foo { color: green }
    
    /* IE11 styles */
    *::-ms-backdrop, .foo { color: red }
}

Nach dem Login kopieren

Schlüsselprinzip

Diese Filter funktionieren, weil :

Wenn ein Benutzeragent (Browser) den Selektor nicht verstehen kann (da es ist kein gültiges CSS 2.1), es muss sowohl den Selektor als auch den nachfolgenden Deklarationsblock ignorieren.

Beispiel

Bedenken Sie den folgenden HTML- und CSS-Code:

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <style>
            @media all and (-ms-high-contrast:none)
            {
                .foo { color: green } /* IE10 */
                *::-ms-backdrop, .foo { color: red } /* IE11 */
            }
        </style>
    </head>
    <body>
        <div class="foo">Hi There!!!</div>
    </body>
</html>

Nach dem Login kopieren

In IE11 wird der Selektor *::-ms-backdrop erkannt und der Text „Hallo!!!“ wird rot angezeigt. In Nicht-IE-Browsern ignorieren sie diese Regeln einfach.

Das obige ist der detaillierte Inhalt vonWie kann ich CSS-Hacks verwenden, um nur Internet Explorer 11 anzusprechen und zu formatieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!