IE中设置PNG格式背景透明

 PNG作为网页通用的图片格式，早已经被大家确认，但是微软不知出于何种目的，一直不肯让IE支持透明的PNG图片。   IE没有把PNG的Alpha通道打开，如果想在IE中正确显示透明的PNG图，必须手动给它添加滤镜。
1.运用滤镜：
<div style="width:100%;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='图片地址', sizingMethod='image');"></div> <img src="spacer.png" mce_src="spacer.png" style="filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enable=true, src='image.png', sizingMethod=scale);" mce_style="filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enable=true, src='image.png', sizingMethod=scale);" alt="display png" />
2.建立htc文件：
<!-- HTC PNG Alpha Channel Support for IE 1.2 --> <!-- Download form http://www.mixfog.com --> <public:component> <public:property name="alpha" /> <public:property name="dummy" /> <mce:script type="text/javascript"><!-- var propertychange=readystatechange=function(){}; var dummy=null; if((element.tagName=='IMG')&&(typeof document.all!='undefined')&&(typeof document.getElementById!='undefined')&&(navigator.platform=='Win32')){ readystatechange=function(){ if((element.readyState=='loading')||(element.readyState=='complete')){ if((element.alpha!=0)||((element.alpha==null)&&(element.src.substr(-4)=='.png'))){ element.alpha=1; if(!dummy){ dummy=document.createElement('div'); element.parentNode.insertBefore(dummy,element); dummy.runtimeStyle.position ='absolute'; dummy.runtimeStyle.zIndex =element.currentStyle.zIndex; element.runtimeStyle.zIndex =element.currentStyle.zIndex+1; dummy.runtimeStyle.filter =element.currentStyle.filter+"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+element.src+"',sizingmethod=scale)"; element.runtimeStyle.filter =element.currentStyle.filter+"progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; } dummy.runtimeStyle.width=element.offsetWidth+"px"; dummy.runtimeStyle.height=element.offsetHeight+"px"; dummy.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src=element.src; } } } propertychange=function(){ if(!dummy||(event.propertyName=='dummy'))return; dummy[event.propertyName]=element[event.propertyName]; dummy.runtimeStyle.width=element.offsetWidth+"px"; dummy.runtimeStyle.height=element.offsetHeight+"px"; dummy.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src=element.src; dummy.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").enabled=element.alpha; element.filters.item("DXImageTransform.Microsoft.Alpha").enabled=element.alpha!=0; } } // --></mce:script> <public:attach event="onpropertychange" onevent="propertychange()" /> <public:attach event="onreadystatechange" onevent="readystatechange()" /> </public:component>

  css中调用：
img{behavior:url(png.htc)}

http://www.sino8848.com/article_detail.asp?id=969&typeid=45