Bien que je connaisse CSS et div auparavant, je ne connais vraiment rien sur les problèmes de compatibilité du navigateur. Cette fois, après avoir été présenté par des amis, il y a aussi le hack css cette chose magique. Je l'ai essayé et j'ai trouvé que cela fonctionnait vraiment. Beaucoup de gens sont soucieux des problèmes de compatibilité du navigateur, et j'ai utilisé le hack css pour tout résoudre. Partagez directement le hack css organisé
CSS Hack est un CSS standard ne peut pas être compatible avec les résultats d'affichage des navigateurs utilisera la méthode de remède, jusqu'à ce que les fabricants de navigateurs parviennent à un consensus sur l'analyse du CSS, nous ne pouvons utiliser que cette méthode pour accomplir une telle tâche.
Lorsque j'ai développé le front-end, les navigateurs que j'ai testés étaient : IE7, IE6, Opera9 (version 9.25 8825 au moment de la rédaction), Safari3 (version 3.0.4 523.15 au moment de la rédaction), Firefox2 (version 2.0.0.11 au moment de la rédaction).
Sur la base du sélecteur normal {property : value ; }, le hack est souvent utilisé pour le même élément en fonction de la situation pour atteindre l'uniformité entre les navigateurs.
Série :
Sélecteur {+property : value ; } avec un signe plus « + » au nom de l'attribut, ce hack est reconnu uniquement par la série IE.
Sélecteur {*property : value ; } avec un astérisque « * » au nom de la propriété, ce hack est reconnu uniquement par la famille IE.
Sélecteur {_property : value ; } avec un soulignement « _ » au nom de la propriété, ce hack est reconnu uniquement par la famille IE (à l'exception de IE7).
* html sélecteur {property : value ; } Applique l'héritage * html sélecteur sur le sélecteur, ce hack n'est reconnu que par la famille IE (sauf IE7).
html/** / > sélecteur de corps {property : value ; } Appliquer l'héritage sur le sélecteur html/** / > sélecteur de corps, ce hack ne peut être reconnu que par la série IE (à l'exception de IE7).
Sélectionneur {Property/** / :value ; } Ajoutez un commentaire entre le nom de l'attribut et le point-virgule " :" pour masquer l'utilisation de IE6.
Sélecteur/** Propriété {/** / :value ; } Ajoutez un commentaire entre le sélecteur et les crochets "{" et entre le nom de l'attribut et le point-virgule " :" pour masquer l'utilisation de IE5 et IE6 (pas IE5.5).
Sélectionnez/** / {property : value ; } Ajoutez un commentaire entre le sélecteur et les parenthèses "{" pour masquer l'utilisation de IE5.
* + sélecteur html {property : value ! important ; } Appliquez l'héritage sur le sélecteur * + sélecteur html Plus ! important, ce hack est identifiable seulement par IE7.
Firefox :
* : lang (lang) sélecteur {property : value ! important ;} Ajoutez avec la pseudo-classe lang (langue) ! Pour le moment, seul Firefox peut le reconnaître.
Safari :
Sélecteur : empty {property : value ! important ;} Ajoutez avec la pseudo-classe empty ! Si important est défini, seul Safari peut le reconnaître pour le moment.
Opéra :
@media all and (min-width : 0px) {selector {property : value ; } } Si vous utilisez une méthode d'héritage spéciale pour la définition, seul Opera peut le reconnaître.
Le hack ci-dessus n'est pas complet, tout le monde complétera ensemble.
L'utilisation la plus courante de Hack est le modèle de boîte CSS Hack, le Hack flottant clair.
Le modèle de boîte CSS a des erreurs d'analyse graves sur IE5.X. Ce hack est pour IE5.x :
selctor {width : width IE5.X ; voice-family : ""} "" ; voice-family : inherit ; width : largeur correcte ; }
Effacer le Hack flottant, croyez que cette définition est utilisée par beaucoup de gens :
sélecteur : after {content : "." ; display : block ; height : 0 ; clear : both ; visibility : hidden ;}
En outre, il y a beaucoup, beaucoup d'utilisation de CSS Hack, une liste peut être écrite comme un livre... pensez à ajouter à nouveau.