关于PNG透明，IE6，PNG8，PNG24，PNG32

时间：2010-1-13 20:01:00 字体：[大中小] 收藏我要投稿

PNG透明在IE中的兼容向来是麻烦的事情！

今天在写一段代码的时候，无意间发现，Fireworks导出的PNG24格式的透明图片竟然在IE7，FF下全部无效。当保存为PNG32的时候，透明才有效。而用PS保存为PNG24的时候就是正常的。正当我不解的时候发现，PS导出的PNG24在Fireworks里打开竟然是PNG32…..

让这几种PNG搞晕了，希望能得到高手的指点。

IE6不支持png24的透明，却可以很好的支持PNG8的索引透明。

介绍一个IE6专用的PNG hack，就是很著名的iepngfix.htc呵呵。

首先要下载这个到你的站点目录下iepngfix.htc

将这段条件注视写进你的head

<!--[if lt IE 7]>
<style type="text/css">
.photo { behavior: url(iepngfix.htc); }
</style>
<![endif]-->

这个photo就是你的图片或者图片容器的class。URL里是你的文件路径。

现在就OK了。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title>  </head> <body> <div style="width:300px; height:400px; position:relative;"><div style="width:200px; height:200px; position:absolute; top:50px; left:50px; background:url(http://www.caihong.cc/1.png);" class="photo" ></div>结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章结束文章</div> </body> </html>

提示：您可以先修改部分代码再运行

资料来源：彩虹前端设计BLOG http://www.caihong.cc/?p=73

作者不见不散， 本文仅代表作者观点,与龙卷风资讯网立场无关。

关于PNG透明，IE6，PNG8，PNG24，PNG32

我来说两句

本文读者感兴趣话题

站长推荐的话题