Maison interface Web tutoriel CSS Comment puis-je détecter de manière fiable IE11 à partir d'IE10 à l'aide de CSS ou de JavaScript ?

Comment puis-je détecter de manière fiable IE11 à partir d'IE10 à l'aide de CSS ou de JavaScript ?

Dec 30, 2024 am 11:45 AM

How Can I Reliably Detect IE11 from IE10 Using CSS or JavaScript?

Détection d'IE10 et IE11 à l'aide de la détection des capacités/fonctionnalités CSS

Le défi

IE11 le fait ne prend pas en charge les balises de détection du navigateur utilisées dans IE10. Pour différencier les deux navigateurs, une capacité CSS ou une détection de fonctionnalités est nécessaire.

Styles de compatibilité IE10

La plupart des styles IE10 sont également pris en charge par IE11. Par conséquent, l'utilisation de techniques de détection basées sur les capacités qui ont fonctionné pour IE10 ne fera probablement pas la distinction entre IE10 et IE11.

Styles et capacités uniques d'IE11

Voici quelques styles et fonctionnalités uniques capacités qui peuvent être utilisées pour détecter IE11 spécifiquement :

  • _:-ms-fullscreen : Un hack pour déclencher un mode plein écran qui ne fonctionne que dans IE11 et supérieur.
  • :root .ie11up : Un style qui cible les : élément racine uniquement dans IE11 et supérieur.

Exemple CSS :

_:-ms-fullscreen,
:root .ie11up {
  /* Styles specific to IE11 */
}
Copier après la connexion

Alternatives JavaScript

Si la détection CSS n'est pas réalisable, envisagez d'utiliser des alternatives JavaScript, telles que :

  • Modernizr : une bibliothèque populaire qui détecte les fonctionnalités du navigateur à la page chargement.
  • Sélection de l'agent utilisateur : Utilisation de JavaScript pour analyser la chaîne de l'agent utilisateur pour obtenir des informations spécifiques sur le navigateur.

Considérations supplémentaires

  • La détection des agents utilisateurs n'est pas fiable en raison du risque d'usurpation d'identité ou de masquage intentionnel du navigateur. identité.
  • Utilisez la détection basée sur les capacités principalement pour les fonctionnalités non critiques et considérez l'amélioration progressive et la dégradation gracieuse comme la solution idéale.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article chaud

Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Article chaud

Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Tags d'article chaud

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Ajout d'ombres de boîte aux blocs et éléments WordPress Ajout d'ombres de boîte aux blocs et éléments WordPress Mar 09, 2025 pm 12:53 PM

Ajout d'ombres de boîte aux blocs et éléments WordPress

Créez un formulaire de contact JavaScript avec le cadre Smart Forms Créez un formulaire de contact JavaScript avec le cadre Smart Forms Mar 07, 2025 am 11:33 AM

Créez un formulaire de contact JavaScript avec le cadre Smart Forms

Créer un éditeur de texte en ligne avec l'attribut satisfaistable Créer un éditeur de texte en ligne avec l'attribut satisfaistable Mar 02, 2025 am 09:03 AM

Créer un éditeur de texte en ligne avec l'attribut satisfaistable

Travailler avec GraphQL Caching Travailler avec GraphQL Caching Mar 19, 2025 am 09:36 AM

Travailler avec GraphQL Caching

Faire votre première transition Svelte personnalisée Faire votre première transition Svelte personnalisée Mar 15, 2025 am 11:08 AM

Faire votre première transition Svelte personnalisée

Demystifier les lecteurs d'écran: formulaires accessibles et meilleures pratiques Demystifier les lecteurs d'écran: formulaires accessibles et meilleures pratiques Mar 08, 2025 am 09:45 AM

Demystifier les lecteurs d'écran: formulaires accessibles et meilleures pratiques

Comparaison des 5 meilleurs constructeurs de formulaires PHP (et 3 scripts libres) Comparaison des 5 meilleurs constructeurs de formulaires PHP (et 3 scripts libres) Mar 04, 2025 am 10:22 AM

Comparaison des 5 meilleurs constructeurs de formulaires PHP (et 3 scripts libres)

Téléchargement de fichiers avec Multer dans Node.js et Express Téléchargement de fichiers avec Multer dans Node.js et Express Mar 02, 2025 am 09:15 AM

Téléchargement de fichiers avec Multer dans Node.js et Express

See all articles