Maison > interface Web > tutoriel CSS > le corps du texte

Résoudre les problèmes de compatibilité de l'échange IE5/IE5.5/IE6/FF——CSS_Experience

PHP中文网
Libérer: 2016-05-16 12:07:41
original
1465 Les gens l'ont consulté

Reposté depuis Blue Ideal
Biais de l'auteur
Adresse originale http://www.blueidea.com/tech/site/2006/3296.asp
J'ai trouvé plusieurs versions différentes qui peuvent s'exécuter indépendamment du navigateur IE , utilisez-le simplement pour tester le problème de compatibilité de la page. Vous ne le saurez pas tant que vous ne l'aurez pas essayé. Les pages qui fonctionnent bien dans IE6 et FF deviendront un gâchis dans IE5 et IE5.5. J'ai toujours entendu dire qu'IE5 était un "clou" dans la création de standards WEB, et maintenant je le fais. il faut y croire.

Puisqu'il y a un problème, cherchons une solution. Après une recherche sur Internet, il existe encore de nombreux articles connexes, je pense que la méthode la plus directe est les « commentaires conditionnels IE », qui peuvent être facilement utilisés pour. Différentes versions des styles d'écriture IE. Mais cela nécessite d'écrire un style pour chaque version, ce qui n'est pas propice à l'optimisation des fichiers.

Après avoir recherché des HACK CSS associés, j'ai pensé que les HACK IE5/IE5.5/IE6/FF devraient être écrits ensemble. Après avoir testé, j'ai finalement trouvé une bonne méthode. implémentez-le :
Tout le monde sait que l'utilisation de l'instruction !important peut augmenter la priorité d'application des règles de style spécifiées, comme dans l'exemple suivant :
----------------- - -------------------------------

Copier le codeLe code est le suivant :

E1{  
background-color: red !important;/*提升优先权*/  
background-color: blue;  
}
Copier après la connexion

------------------------------ ---- ---------------

Mais il y aura un problème lors de l'écriture comme ceci dans IE. Lisez mes "À propos de la priorité des feuilles de style CSS" et "À propos. Feuille de style CSS" "Supplément de priorité", vous saurez que l'utilisation de la déclaration !important dans IE6 et FF peut augmenter le niveau de priorité, mais la déclaration !important dans IE6 n'est pas absolue, elle sera remplacée par des définitions d'attributs ultérieures du même nom. C'est-à-dire que dans l'exemple ci-dessus, IE6 applique la dernière valeur de couleur d'arrière-plan, qui est « bleu », tandis que dans FF, la valeur de couleur d'arrière-plan est « rouge ». Sur cette base, nous pouvons séparer les styles de FF et IE.
OK, les problèmes de FF et IE ont été résolus, résolvons maintenant le problème d'IE lui-même.
Après avoir lu "Une autre façon de contourner IE6 pour prendre en charge IE5 - IE prend également en charge ">" de Dudu, j'ai eu cette idée. Est-il vraiment possible pour IE de le reconnaître en utilisant ">" ? Regardons un exemple :
--------------------------------------------- ------- --------

E1{  
background-color: red;  
>background-color: blue;
Copier après la connexion

}
------------------- ------- -----------------------

La couleur de fond obtenue dans FF est rouge, tandis que la couleur de fond obtenue dans IE est bleu, selon les règles de redéfinition du style, si le navigateur peut reconnaître ">", il devrait avoir un fond bleu, on peut donc savoir que ">" ne peut être reconnu que par IE. important! Tout le monde le saura plus tard. (Remarque : j'ai testé d'autres symboles, tels que "~", "`", "

----------------------------------- ------ -----------------------------

Cela ne permettrait-il pas d'économiser quelques octets ? , mais HACK n'est pas un standard. Si vous abusez de HACK, cela ne fera que s'éloigner de plus en plus du standard


Ce qui précède vise à résoudre la compatibilité d'IE5/ ! IE5.5/IE6/FF ! Question - Contenu d'échange CSS_Experience, veuillez faire attention au site Web PHP chinois (www.php.cn) pour plus de contenu connexe !

Étiquettes associées:
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal