说到IE6，所有WEB开发人员无不咬牙切齿，痛心疾首，javascript,css各种兼容问题有没有，其实在国外IE6基本上消失了的，只有在天朝IE6的使用率到目前（2013-6-19）还相当的高。
且看百度统计IE6使用情况数据图标如下
IE6浏览器市场占用率16%，可以看到IE6的份额还是比较大的
今天跟版网就挖一个让前端人员咬牙的IE6诟病：PNG半透明图片在IE6下不透明的问题
如果你是IE6浏览器的话，下面跟版网的LOGOPNG图片并不是想象中的透明效果，而是原本应该透明的区域变成了不透明的灰色，悲剧啊，除了万恶的IE6外其他浏览器效果都是正常的，
接下来介绍几种PNG图片在IE6中不透明的解决办法
1、用自己的PNG，让IE6一边去吧
首先制作PNG图片的时候，另存为一个GIF图片，因为IE6是支持GIF图片透明,然后在css定义
.pngtest{ background:url(mark.png); _background:url(mark.gif);}优点：方便、快捷，使用超简单
缺点：对于PNG图片只是某些局域透明，该方法比较奏效，但图片要是半透明的话，这种方法就实现不了
该方法延伸的另外一种解决办法：用PS或者其他图片编辑工具把png图片保存为8位格式的，这样IE6就支持透明了
2、CSS滤镜实现PNG图片半透明
.pngwrap{ padding:80px; background:green;}
.pngtest{ width:165px; height:50px; overflow:hidden; text-indent:-9999em;
background:url(http://www.genban.org/data/mark/mark.png) no-repeat;
_background:none;
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.genban.org/data/mark/mark.png' sizingMethod='scale' enabled=true);
}测试IE6利用CSS滤镜解决PNG图片透明问题
代码说明：_前缀的css属性只有IE6能识别，至于为什么要加上_background:none;，原因是前面定义的background图片的层深（可以理解为属性的z-index），比filter的要高，就会把filter定义的图片挡住，所以这里要让IE6的背景为none，PS：filter中的图片路径可以为远程图片路径，也可以是相对路径，如果使用相对路径，那应该是相对于页面的路径而非CSS
优点：不需要JS补丁，图片维护成本低，因为就一张png图片
缺点：filter定义的图片不支持 background-position:;(定位) background-repeat:;(平铺)属性，所以不能使用CSS Sprite技术，且该方法不能应用于img标签上，当应用于链接a标签上时有时会导致链接无法点击的情况，此时需要定义该a标签position:relative
3、HTC插件PNG图片IE6任我行
<q>从5.5版本开始，Internet Explorer（IE）开始支持Web 行为的概念。这些行为是由后缀名为.htc的脚本文件描述的，它们定义了一套方法和属性，程序员几乎可以把这些方法和属性应用到HTML页面上的任何元素上去。</q>详细的htc文件介绍请稳步
下载IE6浏览器PNG图片透明HTC插件
复制iepngfix.htc和blank.gif文件到你网站目录
定义将会使用PNG图片的标签上定义,如下css样式
img,div{behavior:url(iepngfix.htc);}修改iepngfix.htc中IEPNGFix.blankImg = 'images/blank.gif';路径为你的图片路径
让IE6浏览器加载JS文件
<!--[if IE 6]><script type="text/javascript" src="../js/iepngfix_tilebg.js"></script><![endif]-->
优点：配置好这个，那整个站点要使用就很方便了，一次配置，终身受用
缺点：配置相对方法，网站会多出三个文件，不支持元素hover等伪类，不能使用CSS Sprite技术，页面加载初期还是会看到png图片透明区域是灰色的
4、CSS版JS解决方法
该方法也需要一个透明的blank.gif图片，第三方法压缩包中有，这里不单独提供了，定义Css样式
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);}
代码说明：this.src = "blank.gif" 路径也是相对于页面文件的，而非CSS文件
优点：方法相对简单
缺点：需要添加一个透明图片blank.gif，仅支持img标签即不支持元素设置的PNG背景图片，不支持元素hover等伪类，刚加载时也会出现灰色
5、原生态javascript解决办法
javascript解决IE6 PNG图片不透明的插件比较多，看个人喜好选择使用了
插件一：iepngfix
下载IE6浏览器PNG图片透明iepngfix插件
让IE6浏览器加载JS文件
<!--[if IE 6]><script type="text/javascript" src="js/iepngfix.js"></script><![endif]-->
插件二：DD_belatedPNG
该插件应该算是真正意义上的插件了，其使用方法很插件化
下载IE6浏览器PNG图片透明DD_belatedPNG插件
<!--[if IE 6]><script type="text/javascript" src="js/DD_belatedPNG.js"></script><![endif]-->
使用方法：
DD_belatedPNG.fix(".pngtest,#pngtest,.pngtest img,.pngtest:hover");fix()参数传递要透明元素 或者子元素，该方法和jQuery选择$使用基本相同，只是多个元素间分隔用的是","而jQ用的是空格，为了更方便可以在文件结尾加上
window.onload = function()
{
DD_belatedPNG.fix(".pngFix,.pngFix:hover");
}这样在页面中在需要透明的元素上加class="pngFix xx bbb"，class中只要包含有pngFix就可以了
优点：支持img标签，CSS Sprite、背景、平铺、伪类，不需要配置啥，引入JS就可以使用，赞一个
缺点：加载初期PNG图片会出现灰色
插件三：EvPng
该插件使用方法包括优缺点都跟DD_belatedPNG相同，不再详述
下载IE6浏览器PNG图片透明EvPng插件
插件四：jQueryPngFix插件
下载IE6浏览器PNG图片透明jQueryPngFix插件
修改pngfix.js文件中blankgif: 'images/blank.gif'透明GIF图片路径为相对页面路径
让IE6浏览器加载JS文件
<!--[if IE 6]><script type="text/javascript" src="js/pngfix.js"></script><![endif]-->
优点：支持img、css背景
缺点：需要jQuery库支持，不支持CSS Sprite、平铺、伪类，加载初期会出现灰色
有了这种方法htc的解决方案，显得多于了，不过这里介绍的htc解决IE6 PNG透明问题只是htc功能的冰山一角，htc在其他方面的应用远远比这强大的多