CSS-Hack-Enzyklopädie – Bringen Sie Ihnen bei, wie Sie IE6-IE10, FireFox, Chrome und Opera_Experience Exchange unterscheiden können

Die aktuellen Browser sind IE6-IE10, Firefox, Chrome, Opera und Safari. . . Es gibt so viele, dass man sagen kann, dass hundert Denkrichtungen miteinander konkurrieren, und es gibt viele Optionen für Benutzer, aber das ist für Web-Frontend-Entwickler eine Qual.
Heute habe ich einige häufig verwendete CSS-Hacks zusammengestellt, darunter häufig verwendete IE-Hacks und Hacks für Firefox-, Chrome- und Opera-Browser. Ich habe diese CSS-Hacks kombiniert und einen kleinen Browser-Tester geschrieben. Wie im Bild gezeigt:

Werfen wir einen Blick auf den Code:

HTML-Teil:

Code kopieren Der Code lautet wie folgt:

= "Hintergrundfarbe: #ccc;

Hintergrundfarbe in IE8: #06f

                                                                                                                                                                                ​
 

Hintergrundfarbe unter IE10: #0ff

 

#ff0

> ;
                                                                                                                  p> ;Hintergrundfarbe in Opera: #0f0

< ;/div>



CSS-Teil, in diesem Teil wird nur der Hack-Teil des Codes veröffentlicht, das Layout wird nicht veröffentlicht:

Code kopieren

Der Code lautet wie folgt:.content .test { width : 200px; Höhe: 200px;

Hintergrund: #06f9; /*IE*/

*Hintergrund: #666; */
_background: #ccc; /*IE6*/
}

/* webkit und opera */
@media all and (min-width:0){
.content .test {
Hintergrund: #0f0;
}

/* webkit */
@media screen und (-webkit-min-device-pixel-ratio :0) {
.content .test {
Hintergrund: #ff0;
}
}

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

/*IE9+*/
@media all and (min-width: 0) {
.content .test{
Hintergrund: #f009;
}
}

/*IE10+*/
@media screen und (-ms-high -contrast: aktiv), (-ms-high-contrast: none) {
.content .test {
Hintergrund: #0ff;
}
}





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