上一篇
下一篇
10-01
05
老生常谈，关于IE6下png透明的几种解决方案
作者:admin 日期:2010-01-05
继《PNG图在IE6下透明的终极解决方案（已知3种）》
地址为：http://www.imeetyou.net/article.asp?id=321
上述，第一种，利用利用滤镜实现IE6 下背景透明，代码:
.first { width:400px; margin:0 auto; height:300px; background:url(images/bg1.png); }
* html .first { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src="images/bg1.png"); background:none; }
这个方法会遇到一个比较麻烦的问题，就是在ie6下，如果你的透明图片上刚好放一段文字，而文字中又有链接的时候，那么这个链接就会无法点击，
一种解决方法是在 css里加 z-index:10; position:relative;
这样就会解决ie 无法点击链接的情况。
但同时有另一个问题，这种方法没法解决png背景平铺的问题。
搜索一气，可以有另外2种解决方案：
第一：有个 DD_belatedPNG
运用javascript方法解决了，PNG-24在IE6下做背景透明的问题，效果很不错，支持background-position和 background-repeat的CSS定义，以及:hover 等CSS属性。插件比较小，压缩后4K多一点，可以去官方网站去下载。
使用也比较简单
针对ie6
<!--[if lte IE 6]>
<script type="text/javascript" src="http://xfiles.cdnmyspace.cn/dir/vi/v2/DD_belatedPNG_0.0.8a-min.js"></script>
<script type="text/javascript">
DD_belatedPNG.fix('.mod_box'); //这里写要做透明的class
DD_belatedPNG.fix('img.mod_box'); //这里写要做透明的class
DD_belatedPNG.fixPng(document.getElementById("Box")); //这里写要透明的div 的 id
</script>
<![endif]-->
管方网站： http://www.dillerdesign.com/experiment/DD_belatedPNG/
------------------------------------------------------------------------------------------------
第二，用 iepngfix
这个是用引用一个htc 文件，如果做背景透明 另外要引用一个js文件，
但会有一个莫名其妙的问题，浮动情况下，背景总对的不齐，我没解决。
哎，也不想使用这样的方法。页面效率不好。
管网：http://www.twinhelix.com/css/iepngfix/
另外，如果你可以用gif替代png24 的话，用gif就好。实在不行，就用第一种方案好了。
倒霉的ie6, 大家都在为它绞尽脑汁！
地址为：http://www.imeetyou.net/article.asp?id=321
上述，第一种，利用利用滤镜实现IE6 下背景透明，代码:
复制内容到剪贴板
程序代码
程序代码.first { width:400px; margin:0 auto; height:300px; background:url(images/bg1.png); }
* html .first { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src="images/bg1.png"); background:none; }
这个方法会遇到一个比较麻烦的问题，就是在ie6下，如果你的透明图片上刚好放一段文字，而文字中又有链接的时候，那么这个链接就会无法点击，
一种解决方法是在 css里加 z-index:10; position:relative;
这样就会解决ie 无法点击链接的情况。
但同时有另一个问题，这种方法没法解决png背景平铺的问题。
搜索一气，可以有另外2种解决方案：
第一：有个 DD_belatedPNG
运用javascript方法解决了，PNG-24在IE6下做背景透明的问题，效果很不错，支持background-position和 background-repeat的CSS定义，以及:hover 等CSS属性。插件比较小，压缩后4K多一点，可以去官方网站去下载。
使用也比较简单
复制内容到剪贴板 程序代码
程序代码针对ie6
<!--[if lte IE 6]>
<script type="text/javascript" src="http://xfiles.cdnmyspace.cn/dir/vi/v2/DD_belatedPNG_0.0.8a-min.js"></script>
<script type="text/javascript">
DD_belatedPNG.fix('.mod_box'); //这里写要做透明的class
DD_belatedPNG.fix('img.mod_box'); //这里写要做透明的class
DD_belatedPNG.fixPng(document.getElementById("Box")); //这里写要透明的div 的 id
</script>
<![endif]-->
管方网站： http://www.dillerdesign.com/experiment/DD_belatedPNG/
------------------------------------------------------------------------------------------------
第二，用 iepngfix
这个是用引用一个htc 文件，如果做背景透明 另外要引用一个js文件，
但会有一个莫名其妙的问题，浮动情况下，背景总对的不齐，我没解决。
哎，也不想使用这样的方法。页面效率不好。
管网：http://www.twinhelix.com/css/iepngfix/
另外，如果你可以用gif替代png24 的话，用gif就好。实在不行，就用第一种方案好了。
倒霉的ie6, 大家都在为它绞尽脑汁！
文章来自: 
引用通告: 
Tags: 
相关日志:
评论: 0 | 引用: 0 | 查看次数: 1257
发表评论
