[CSS] - 让IE6支持PNG-24透明背景(多个方法)

1.用iepngfix

示例:http://www.twinhelix.com/css/iepngfix/demo/ 

下载地址:http://www.twinhelix.com/css/iepngfix/

优点:能够整个页面都能自动处理PNG-24的透明背景,不用特意去做另一幅图片代替等麻烦。

缺点:不能用太多,否则页面加载速度大大变慢。

*************************************************************************************************

2.用滤镜效果

虽然不是每个浏览器都能支持滤镜,但只是为了解决PNG-24透明背景,就无所谓啦。

来源:有道的源代码

<style>
body
{
background
:url(bg.gif);
}
.test
{
width
:451px;
height
:42px;
background
:url(test.png);
_background
:none;
_filter
:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='test.png',sizingMethod='crop');
}
</style>
<div class="test"></div>

优点:代码少,简单。

缺点:对PNG-24图片的图片都要用上滤镜

*************************************************************************************************

3.用PNG-8的图片代替

来源:网络

PNG-8一般都是用PS保存:(在“文件->存储为Web和设备所用格式”上保存,有时候会用上下图里的“扩散透明度仿色”)

优点:不用像上面所说那样处理

缺点:如果有圆角的话,会看起来有点直角的感觉,如果图片外边有渐变(包括阴影效果)会很容易让阴影的大部分颜色被其它颜色所代替,产生失真大

*************************************************************************************************

4.使用CSS hack

能让PNG-24正常显示的就直接显示,否则使用CSS hack来替换其它格式图片(如jpg),这个方法是看别人的源码才知道的,属于最无奈的方法。

优点:暂时想不到,至少能让图片正常一点的显示。

缺点:网站的文件多,占用空间大,修改不方便。

*************************************************************************************************

PS:PNG-8与GIF的透明背景都能让IE6直接显示,但与PNG-24对比,图片失真得太离谱了

posted @ 2011-03-08 21:28  炎峰森林影  阅读(1689)  评论(0编辑  收藏  举报