CSS Hack Encyclopedia-Teach you how to distinguish IE6-IE10, FireFox, Chrome, Opera_Experience exchange

The current browsers are IE6-IE10, Firefox, Chrome, Opera, and Safari. . . There are so many, it can be said that a hundred schools of thought are contending, and there are many options for users, but this is a pain for Web front-end developers.
Today I sorted out some commonly used CSS Hacks, including commonly used IE hacks and Hacks for Firefox, Chrome, and Opera browsers. I combined these CSS Hacks and wrote a small browser tester. As shown in the picture:

Let’s take a look at the code:

html part:

Copy code The code is as follows:

Background color under IE6: #cccphpc nltphpcn/span>

Background color under IE7: #666

#06f

Background color under IE9: #f00phpc nltphpcn/span>

IE10 Background color: #0ff

webkit,Safari,Chrome background color: #ff0

FireFox background color: # f0f

Opera background color: #0f0

n

CSS part, only the Hack part of the code will be posted in this part, and the layout will not be posted:

Copy code The code is as follows:

.content .test {
width: 200px ;
height: 200px;
background: #f60; /*all*/
background: #06f9; /*IE*/
*background: #666; /*IE6,7*/
_background: #ccc; /*IE6*/
}

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

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

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

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

/*IE10 */
@media screen and (-ms-high-contrast : active), (-ms-high-contrast: none) {
.content .test {
.content: background: #0ff;
}
}

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