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制作
2)或用border制作
3.ie双边距bug:
概念:元素向左浮动并且设置了左侧的外边距出现了这样的双边距bug。同理,元素向右浮动并且设置右边距也会出现同样的情况。同一行如果有多个浮动元素,第一个浮动元素会出现这个双边距bug,其它的浮动元素则不会。参见:http://www.chinaz.com/design/2009/1102/96698.shtmlul 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下有兼容问题,有空时补一下出现的问题)