CSS Hack Encyclopedia - Apprenez à distinguer les échanges IE6-IE10, FireFox, Chrome, Opera_Experience

Les navigateurs actuels sont IE6-IE10, Firefox, Chrome, Opera et Safari. . . Il y en a tellement, on peut dire qu'une centaine d'écoles de pensée s'affrontent, et il existe de nombreuses options pour les utilisateurs, mais c'est un problème pour les développeurs Web front-end.
Aujourd'hui, j'ai trié certains hacks CSS couramment utilisés, y compris les hacks IE et les hacks couramment utilisés pour les navigateurs Firefox, Chrome et Opera. J'ai combiné ces hacks CSS et écrit un petit testeur de navigateur. Comme le montre l'image :

Jetons un coup d'œil au code :

partie html :

Copier le code Le code est le suivant :

                                                                           ="couleur de fond : #ccc;">#ccc

                                                                                                                                                                                                                  #666;">#666

Couleur d'arrière-plan dans IE8 :                                                                                                                                                                    

 

Couleur d'arrière-plan sous IE10 : #0ff

  #ff0                                                                                                                      p> ;Couleur d'arrière-plan dans Opera : #0f0

< ;/div>



Partie CSS, seule la partie Hack du code sera postée dans cette partie, et la mise en page ne sera pas publiée :

Copier le code

Le code est le suivant :.content .test { largeur : 200px;

hauteur : 200px ;

arrière-plan : #f60 ; /*tout*/
arrière-plan : #06f9 ; */
_background : #ccc; /*IE6*/
}

/* webkit et opéra */
@media all et (min-width:0){
.content . test {
arrière-plan : #0f0;
}
}

/* webkit */
@écran multimédia et (-webkit-min-device-pixel-ratio :0) {
.content .test {
arrière-plan : #ff0;
}
}

/*FireFox*/
@-moz-document url-prefix () {
.content .test {
background : #f0f;
}
}

/*IE9+*/
@media all et (min-width : 0) {
.content .test{
arrière-plan : #f009;
}
}

/*IE10+*/
@écran multimédia et (-ms-high -contraste : actif), (-ms-high-contrast : aucun) {
.content .test {
background : #0ff;
}
}





css-hack-ms-moz-webkit-o-Jb51.net.rar