<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <body>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS hack that differentiates IE6, IE7, IE8, and FireFox</title>
<style type="text/css">
<!--
#test,#note{
margin:0 auto;
text-align:center;
}
.note{ text-align:left; text-indent:40px;}
#test {
width:200px;
height:30px;
border: 1px solid #000000;
color:#fff;
line-height:30px;
}
.color{
background-color: #CC00FF; /*All browsers will display purple*/
background-color: #FF00009; /*IE6, IE7, and IE8 will display red*/
*background-color: #0066FF; /*IE6 and IE7 will turn blue*/
_background-color: #009933; /*IE6 will turn green*/
}
-->
</style>
</head>
<div id="test" class="color">Test block zss</div>
<div id="note">
<strong style="color:#009933">IE6 ends up green</strong>
<strong style="color:#0066FF">IE7 ends up blue</strong>
<strong style="color:#FF0000">IE8 ends up in red</strong>
<strong style="color:#CC00FF">FireFox finally turns purple</strong>
<div class="note">
Today I saw an article in hiccblogs about IE8 compatibility. It is very simple. Unfortunately, it is only compatible with IE, and it is based on the core of IE7, which has great limitations. I think I am relatively proficient in CSS compatibility. Since IE8 is released, let’s study the compatibility of IE8.
</div>
<div class="note">CSS compatibility has always been a headache for everyone. IE6, IE7 and FF have already troubled everyone. In previous articles, a lot of knowledge in this area was introduced. Since the official version of IE8 was released, I have been trying to find a way to distinguish it from the official version of IE8. Searching on Baidu has many results, and searching on Google has even more results. There is a big difference between the official version and the beta version of IE8 in terms of hacks. Moreover, almost all the methods on the Internet are reprinted from each other. The one that appears most frequently is the hack picture from linxz.cn. Unfortunately, the method in this picture is Invalid for the official version of IE8.
After analysis and summary, we have the following effective solutions. Maybe there will be better and simpler hacks in the future, but for now, this method can solve the urgent need.<br />
</div>
<div class="note">
<ul>
<li style="list-style:none;"><strong style="color:#009933">Simple Example:</strong></li>
<li>"9" Example: "margin:0px auto9;".</li>
<li>The "9" here can distinguish between all IE and FireFox.</li>
<li>"*" IE6 and IE7 can recognize it. IE8 and FireFox cannot.</li>
<li>"_" IE6 can recognize "_", but IE7, IE8, and FireFox cannot</li>
</ul>
</div>
</div>
</body>
</html>