IE7 has been released for some days, so the site needs to look after one more browser. These two days designers are doing compatibility and finding a solution that is both shared and documented. Combined with the previous use of important! and/**/to distinguish between IE5, IE6, Moz experience, the following code distinguishes 4 browsers, the copy code saved into an HTML file to see the effect of it: (
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "> <pead> <meta http-equiv=" Content-type "content=" text/html; Charset=utf-8 "/> <title> Untitled document </title> <style type=" Text/css "> <!--#example {Position:ab Solute; top:50%; left:50%; width:200px; height:150px; Margin-top: -75px; Margin-left: -100px; } #example div {padding:20px; Text-weight:bold; font:11px/150% Verdana, Arial, Helvetica, Sans-serif; Text-align:right; } #example {background:red; /*for moz*/} * HTML #example {background:yellow; /*for ie5*/background/**/: Green; /*for ie6*/} *+html #example {background:blue; /*for ie7*/}--> </style> </pead> <body> <div id= "Example" > <div> Ie5:ye Llow Ie6:green Ie7:blue moz:red</div> </div> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
Special Reminders:
#example {
background:red; /*for moz*/
}
* HTML #example {
Background:yellow; /*for ie5*/
background/**/: Green; /*for ie6*/
}
*+html #example {
Background:blue; /*for ie7*/
}
