浏览器之间的兼容是个问题,而IE的兼容性尤其严重。下面是我搜集的一些处理html/js/css兼容性问题的好方法。
html 条件注释
<html>
<body>
<!--[if IE]>
根据条件判断,这是Internet Explorer<br />
<![endif]-->
<!--[if IE 5]>
根据条件判断,这是Internet Explorer 5<br />
<![endif]-->
<!--[if IE 5.0]>
根据条件判断,这是Internet Explorer 5.0<br />
<![endif]-->
<!--[if IE 5.5]>
根据条件判断,这是Internet Explorer 5.5<br />
<![endif]-->
<!--[if IE 6]>
根据条件判断,这是Internet Explorer 6<br />
<![endif]-->
<!--[if gte IE 5]>
根据条件判断,这是Internet Explorer 5 或者更高<br />
<![endif]-->
<!--[if lt IE 6]>
根据条件判断,这是版小于6的Internet Explorer<br />
<![endif]-->
<!--[if lte IE 5.5]>
根据条件判断,这是Internet Explorer 5.5或更低<br />
<![endif]-->
</body>
</html>
javascript 编译注释
[quote]<script type="text/javascript">
document.write("Non IE Browser or lower version IE<br>");
</script>[/quote]
javascript编译常量
[url]http://www.javascriptkit.com/javatutors/conditionalcompile2.shtml[/url]
css !important.
!importan 在firefox,ie7中支持,在ie6中不支持。
[quote]<div style="color: red !important; color: blue;">
IE7,firefox中显示为红色文字,IE6中显示为蓝色文字
</div>
[/quote]
ie6支持 * html 前缀 ,ie7 支持 *+html 前缀,firefox不支持。
ie支持css expression,在firefox中是不支持的。
[quote]
#testcss {
background-color:red;
}
* html #testcss {
background-color:green;
}
*+html #testcss {
background-color:yellow;
}[/quote]
测试文件见附件。