ie6的兼容总结

ie6的兼容处理总结

1.透明背景图：

.timer
 {
     _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='my.png');
     _background-image: none;
 }

对于其它的浏览器直接使用一张半透明的背景图就可以了

另附：文字不透明，背景透明

background: rgba(126, 5, 89, 0.6); /*chrome等等*/

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#997e0559,endColorstr=#997e0559) 9;

 

2.小的纯色图片，如：小三角等，

1)在ie6中存储为png8背景透明格式
2)或用border制作

3.ie双边距bug:

概念：元素向左浮动并且设置了左侧的外边距出现了这样的双边距bug。同理，元素向右浮动并且设置右边距也会出现同样的情况。同一行如果有多个浮动元素，第一个浮动元素会出现这个双边距bug，其它的浮动元素则不会。

参见：http://www.chinaz.com/design/2009/1102/96698.shtml

 

ul li平排错行，在li中增加：display:inline;

竖排错行：li{ flloat:left; }

 

4.鼠标hover过时，在ie6中不起作用，需加入  

.huabao-center a:hover{
    BACKGROUND-POSITION: 0 0;
    POSITION: relative;
    text-decoration:none;
}

/*alpha要写在hover里在ie6中鼠标划走时才会消失*/
.huabao-center a:hover .item{
    display: block;
    opacity: 0.7;
    -moz-opacity: 0.70;
    filter:Alpha(opacity=70);
}

 
5. ie6,7,8中尽量用a:hover（其它的如：p:hover,td:hover不支持，如要支持使用csshover.htc插件)

 
6.IE6的3像素BUG

   vertical-align:top|middle|bottom 

 

7.position:absolute 时，记得一定要设top,和height (ie6下有兼容问题，有空时补一下出现的问题)