习斋 2007-3-4 04:30
用两个css hack区分ff、ie5、ie5.5、ie6
css hack:
1、在属性名后加一个空格与/**/,例如“font-size /**/:14px;”用于区分出ie5.5
2、在元素名后加/**/,例如 #ie5/*ie5+*/{},用于区分出ie5+
大家如有更好的方法,请不吝分享讨论。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>区分 IE5/IE5.5/IE6/FF</title>
<style type="text/css">
<!--
#ff {
display:block !important;
display: none;
border: 3px double #999999;
width:300px;
height:200px;
padding:10px;
}
#ie5 {
display:none !important;
display:block;/*ie5*/
border: 1px solid #000000;
width:200px;
height:100px;
padding:10px;
margin:30px;
}
#ie5/*ie5+*/{
display:none;
}
#ie55 {
display:none !important;
display:none;/*ie5 & ie6*/
background-color:#FFE8D9;
border:1px dashed #FF3300;
padding:50px;
width:400px;
height:250px;
}
#ie55/*ie5+*/{
display /*ie55*/:block;
}
#ie6{
display:none !important;
display:none;/*ie5*/
font-size:54px;
border:10px solid #CCCCCC;
padding:100px;
}
#ie6/**/{
display:block;
display /*ie5.5*/:none;
}
-->
</style>
</head>
<body>
<div id="ff">这是在 FireFox 下面的效果</div>
<div id="ie5">这是在 Internet Explorer 5 下面的效果</div>
<div id="ie55">这是在 IE 5.5 下面的效果</div>
<div id="ie6">这是在 IE 6 下面的效果</div>
</body>
</html>