css-IE-兼容

jiezi

5 年前

IE 注释法

<!--[if IE 6]>
<link type="text/css" href="ie6.css" rel="stylesheet" />
<![endif]-->
<!--[if gt IE 7]>
<link type="text/css" href="ie7.css" rel="stylesheet" />
<![endif]-->
<!--[if gt IE 8]>
<link type="text/css" href="ie8.css" rel="stylesheet" />
<![endif]-->

选择符前缀法

<style type="text/CSS">
.test{width:80px;}        /*IE 6,IE 7,IE 8*/
*html .test{width:60px;}  /*only for IE 6*/
*+html .test{width:70px;} /*only for IE 7*/
</style>

样式属性前缀法

<style type="text/CSS">
/*“_”只在 IE6 下生效，“*”在 IE6 和 IE7 下生效 */
.test{width:80px;*width:70px;_width:60px;} 
</style>

zoom:1 强行触发 ie 的 hasLayout，特殊情况下无法触发的时候，使用 position:relative 来触发 hasLayout
display:inline-block 在 IE6 和 IE7 中是无法正常使用的，可以通过触发 hasLayout 来达到效果。
a 标签的顺序：l(link)ov(visited)e h(hover)a(active)te lovehate 原则