Maison > interface Web > tutoriel CSS > Comment styliser des éléments spécifiquement pour Internet Explorer 11 à l'aide de CSS Hacks ?

Comment styliser des éléments spécifiquement pour Internet Explorer 11 à l'aide de CSS Hacks ?

Barbara Streisand
Libérer: 2024-12-03 19:10:12
original
318 Les gens l'ont consulté

How to Style Elements Specifically for Internet Explorer 11 Using CSS Hacks?

Comment cibler Internet Explorer 11 avec des hacks CSS

Le ciblage de navigateurs spécifiques, tels qu'Internet Explorer 11, peut être réalisé à l'aide de hacks CSS. Voici un guide pour vous aider à rédiger un hack CSS pour IE 11 :

Pour cibler spécifiquement IE 11, vous pouvez utiliser une combinaison de règles CSS spécifiques à Microsoft. Dans votre HTML, ajoutez la balise méta suivante :

<meta http-equiv="X-UA-Compatible" content="IE=edge">
Copier après la connexion

Dans votre CSS, utilisez la règle @media all et (-ms-high-contrast: none) pour cibler IE 10. Dans cette règle, vous peut spécifier des styles pour les éléments avec la classe .foo.

@media all and (-ms-high-contrast:none) {
  .foo { color: green } /* IE10 */
}
Copier après la connexion

Pour cibler IE11 uniquement, utilisez le *::-ms-backdrop pseudo-élément.

@media all and (-ms-high-contrast:none) {
  *::-ms-backdrop, .foo { color: red } /* IE11 */
}
Copier après la connexion

Cette technique fonctionne car les agents utilisateurs qui ne peuvent pas analyser un sélecteur (dans ce cas, *::-ms-backdrop) l'ignoreront ainsi que le bloc de déclaration suivant. Par conséquent, les styles de la règle spécifique à IE11 ne s'appliqueront qu'à IE11.

Voici un exemple d'extrait de code :



  
    IE10/11 Media Query Test
    
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    
  
  
    
Hi There!!!
Copier après la connexion

En utilisant ces hacks CSS, vous pouvez efficacement styliser les éléments. spécifiquement pour Internet Explorer 11.

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!

source:php.cn
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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal