Heim >Web-Frontend >js-Tutorial >Wie kann man Internet Explorer 10 mit modernen CSS-Techniken effektiv ansprechen?

Wie kann man Internet Explorer 10 mit modernen CSS-Techniken effektiv ansprechen?

DDD
DDDOriginal
2024-11-11 13:33:02531Durchsuche

How to Effectively Target Internet Explorer 10 with Modern CSS Techniques?

Ausrichtung auf Internet Explorer 10: Ein umfassender Leitfaden

Viele Webentwickler stehen vor der Herausforderung, auf bestimmte Browserversionen wie Internet Explorer 10 abzuzielen. Während sich herkömmliche bedingte Kommentare bei IE10 als unzuverlässig erwiesen haben, gibt es alternative Ansätze, die diesem Bedarf effektiv gerecht werden.

Bedingte Kommentare schlagen bei IE10 fehl

Das von Ihnen bereitgestellte Codefragment versucht, dies zu tun Ziel IE10 mit bedingten Kommentaren. Allerdings ignoriert IE10 diese Kommentare und entscheidet sich stattdessen für den verschachtelten HTML-Code. Dies macht diesen Ansatz für die gezielte Ausrichtung auf IE10 unwirksam.

Moderne Browser-Targeting-Techniken

Anstatt sich auf bedingte Kommentare oder Browsererkennungsmethoden (wie navigator.userAgent) zu verlassen, Verwenden Sie moderne CSS-Techniken, die ein präzises Targeting ermöglichen.

Targeting auf IE9, 10 und 11

Um die Versionen IE9 bis IE11 gezielt anzusprechen, verwenden Sie die folgende CSS-Medienabfrage:

@media screen and (min-width:0<pre class="brush:php;toolbar:false">@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS here */
}
) { /* Enter CSS here */ }

Nur ​​auf IE10 ausgerichtet

Ausschließlich auf IE10 mit der folgenden CSS-Medienabfrage abzielen:

@supports (-ms-accelerator:true) {
  .selector { property:value; } 
}

Targeting Edge Browser

Wenn Sie auf den Edge-Browser von Microsoft abzielen müssen, verwenden Sie die folgende CSS-Funktionsabfrage:

Referenzen

  • [Moving Internet Explorer-spezifisches CSS in @media-Blöcke](https://nicolasgallagher.com/about-html-conditional-comments-and-css-media-queries/)
  • [So zielen Sie auf Internet Explorer 10 und 11 ab CSS](https://css-tricks.com/how-to-target-ie10-11-using-css/)
  • [CSS-Hacks für Windows 10 und Microsofts Edge-Webbrowser](https:/ /css-tricks.com/css-hacks-for-windows-10-and-microsofts-edge-web-browser/)

Das obige ist der detaillierte Inhalt vonWie kann man Internet Explorer 10 mit modernen CSS-Techniken effektiv ansprechen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn