IE6下png透明问题解决的最佳方案

isiqi

浏览: 16489748 次
性别:
来自: 济南

最近访客更多访客>>

nison

hellohank

wangyy

devcang

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

2012-07 ( 335)
2012-06 ( 252)
2012-05 ( 362)
更多存档...

HTC CSS IE JavaScript

本来只是一张png透明图片，在IE下是很好解决的，我也尝试了很多种，包括js法，滤镜css法等等，感觉总体来说都不是很完美，而且如果同时使用Sprites方法，就不是那么简单容易的事情了。

最终发现了使用htc方法嵌到css文件中基本可以一次性解决大部分的透明问题。
这种方法已经有很多人介绍过了，但是因为页面是英文，很少有人翻译，也就很少人会去使用。

下面就详细介绍下这种方法：

此方法本身的demo地址：http://www.twinhelix.com/css/iepngfix/demo/
（说过了是全英文的，不要着急哦）

可解决：
1、页面中使用<img>标签加入的png透明图像
2、css中使用background加入的png透明背景（支持多种版本）
3、某些版本的background的png透明，需要在当前页添加一个js解决

下载文件包

1、下载后，解压出来，会有很多文件，其中我们需要用到的有3个文件：
iepngfix.htc，blank.gif，iepngfix_tilebg.js 2、你可以把他们分别传到相应的css，js和images目录中，当然，也可以建立新的文件夹，比如名为：iepng的文件夹，把他们传到其中 3、添加第一句代码，这是在html文件中添加的格式，不要忘记修改htc文件的路径，如果怕出错，直接使用相对根目录的路径，比如/iepng/iepngfix.htc，这样一般不会出错，当然你也可以把behavior: url(iepngfix.htc)这句添加到你的reset.css文件中去

<style type="text/css"> img, div { behavior: url(iepngfix.htc); } </style> 4、使用记事本，或类似的工具打开iepngfix.htc文件，将其中blankImg的文件路径替换成你自己的，比如/iepng/blank.gif，根据自己的实际情况。IEPNGFix.blankImg = '/images/blank.gif'; 5、将下面这句js调用代码加到需要页面的<head>中去（此步不是必须的，如果你的head部分的include统一调用的，推荐一定加上这句） 经过以上步骤，基本可以实现IE下png的透明效果了至少我现在没发现什么问题，如果有出现问题，欢迎一起讨论下，记得跟我说下哦，谢谢啦！