解决ie6png格式bug
PNG(Portable Network Graphics)格式图片可以表现更为绚丽多彩的颜色，常见的一些具有矢量效果的图片、图标都采用png格式，但是具有透明背景的png格式图片在IE6中却不是背景透明的，透明背景部分会显示出#DBEAED的淡灰色，表现效果很糟糕，为了使用透明背景图片只有采用gif格式了，但是gif格式会出现明显的锯齿效果，所以只有设法修复IE6的这个问题。解决的办法就是使用IE的Microsoft.AlphaImageLoader滤镜。
如果希望使用png格式图片作为DOM元素的背景，那么就可以使用滤镜来加载png图片：
css代码：.png{background: url(images/angel.png) no-repeat !important;_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=”images/angel.png”);background:none; width:100px;height:100px;}
HTML代码：<div class=”png”>背景PNG透明</div>
如果png格式的图片不是用来做元素背景，而是直接引入的img图像，那么此时可以把此img标签的src属性替换为一张空的透明gif图像，然后再把png图片加载为元素的背景就可以了。首先要准备一张空白透明的gif图片，一般命名为blank.gif(可自己另起名字)，然后就可以替换png图像了。但是手工替换不太现实，最好一段代码就解决问题：
css代码：
.mypng img {
azimuth: expression(
this.pngSet?this.pngSet=true:
(this.nodeName == “IMG” && this.src.toLowerCase().indexOf(’.png’)>-1?
(this.runtimeStyle.backgroundImage = “none”,
this.runtimeStyle.filter = “progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’” + this.src + “‘,sizingMethod=’image’)”,
this.src = “blank.gif”)
: (this.origBg = this.origBg?
this.origBg
:this.currentStyle.backgroundImage.toString().replace(’url(”‘,”).replace(’”)’,”),
this.runtimeStyle.filter = “progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’” + this.origBg + “‘, sizingMethod=’crop’)”,
this.runtimeStyle.backgroundImage = “none”)),
this.pngSet=true);
}
html代码：<div class=”mypng”><img src=”图片路径” /></div>
最近评论