Maison >interface Web >tutoriel CSS >Un hack CSS pour IE7_Experience Exchange

Un hack CSS pour IE7_Experience Exchange

WBOY
WBOYoriginal
2016-05-16 12:09:261167parcourir

IE7 a corrigé de nombreux bugs et ajouté la prise en charge de certains sélecteurs, donc désormais les hacks pour masquer ou afficher IE tels que *html {} et html>body {} ne fonctionneront pas dans IE7. Bien que CSS Hack ne soit pas recommandé et que les commentaires conditionnels soient un filtre infaillible, les commentaires conditionnels ne peuvent apparaître qu'en HTML, donc CSS Hack a toujours sa place. Nanobot a découvert quelques hacks CSS pour IE7, en particulier :

>corps
html*
*+html

Parmi ces trois méthodes d'écriture, les deux premières sont des méthodes d'écriture CSS illégales et sont ignorées dans les navigateurs conformes aux normes, mais IE7 ne le pense pas. Pour >body, il remplacera le sélecteur manquant par le sélecteur global *, c'est-à-dire qu'il sera transformé en *>body, et ce phénomène existe également non seulement pour le sélecteur >, mais aussi pour les sélecteurs + et ~. Pour html*, puisqu'il n'y a pas d'espace entre html et *, c'est aussi une erreur de syntaxe CSS, mais IE7 ne l'ignorera pas, mais croit à tort qu'il y a un espace ici. Pour le troisième type *+html, IE7 estime que la déclaration DTD devant html est également un élément, donc html sera sélectionné parmi ces trois méthodes, seule cette méthode est une écriture CSS légale, ce qui signifie qu'elle peut passer le validateur. La vérification est donc également une utilisation de hack recommandée par l'auteur.

Finalement l'auteur a donné le meilleur chemin :

IE 6 et versions antérieures
Utilisez * html {} pour sélectionner l'élément html
IE 7 et versions antérieures
Utilisez *+html, * html {} pour sélectionner l'élément html
IE. 7 uniquement
Utilisez **+html {} pour sélectionner l'élément html
IE 7 et les navigateurs modernes uniquement
Utilisez html>body {} pour sélectionner l'élément body
Navigateurs modernes uniquement (pas). IE 7)
Utilisez html>/**/body {} pour sélectionner l'élément body

.

Pour des informations spécifiques, veuillez vous référer au texte original : Hacks CSS faciles pour IE7

Déclaration:
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