使IE浏览器支持PNG格式图片的透明效果
作者：Windm.cn翻译 时间：2008-02-02 16:20:00
PNG格式以支持透明和无损，且相对大小适中，已成为现在网页中图片运用的主流。
有些时候我们在制作网页时使用PNG格式图片，用IE浏览器查看却无法显示需要的效果，半透明
的部分直接给渲染成白色，只有Mozila的FireFox能支持这种透明效果的显示。
先来看下这2两个主要的浏览器对PNG图片透明度的解析情况吧。
Mozilla Firefox
支持PNG透明度渲染，显示无问题
Internet Explorer6
不支持PNG透明显示，显示为白块
解决方法：创建一个容器包含该图片，这里我们用<div>标签.
使用如下HTML代码:
<body>
<div class="pngimg">
</div>
</body>
应用如下CSS样式:
<style>
body {
background-color:#000;
}
div.pngimg {
background:url(flower-transparent.png) no-repeat;
height:100px;
width:100px;
}
</style>
但是这套CSS代码只适用于FireFox,并不适用于IE浏览器,要适用于IE,我们必须要添加适用于IE的另一套CSS样式代码,代码如下:
<!--[if gte IE 5]>
<style type="text/css">
div.pngimg {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='flower.png' ,sizingMethod='crop');
}
</style>
<![endif]-->
如此,IE就可以支持PNG透明度的显示了.该代码其实时调用了IE专有的
Alpha滤镜,注意该滤镜只支持IE5.5或更新的版本.
相关推荐：苏沈小雨css样式表滤镜中文手册chm
标签：png,ie,浏览器,图片
0
投稿猜你喜欢
Python函数中的可变长参数详解
2022-08-01 06:04:57
MySQL错误Forcing close of thread的两种解决方法
2024-01-25 15:24:44
在生成的静态页面中统计点击次数
2009-11-19 13:20:00
SQL Server中Table字典数据的查询SQL示例代码
2024-01-25 13:47:49
Python OpenCV实现视频分帧
2023-06-06 02:38:18
python实现静态服务器
2021-11-24 05:18:13
Python进阶之如何快速将变量插入有序数组
2021-07-26 16:52:51
Mysql存储过程中游标的用法实例
2024-01-22 14:59:10
Python3学习urllib的使用方法示例
2021-09-23 00:08:08
关于鼠标、键盘的几个事件的例子
2008-07-27 17:00:00
使用Python文件读写,自定义分隔符(custom delimiter)
2021-12-06 08:17:51
基于YUV 数据格式详解及python实现方式
2021-12-03 07:28:59
一篇文章带你搞懂Python类的相关知识
2021-06-01 19:31:54
用javascript代替marquee的滚动字幕效果代码
2024-05-22 10:36:09
发一个较复杂的字符串截取函数
2009-12-08 16:23:00
使用Gomock进行单元测试的方法示例
2024-04-25 15:13:23
使用JS批量选中功能实现更改数据库中的status状态值（批量展示）
2024-01-28 00:18:38
关于H1的用法探讨
2008-03-18 12:55:00
MySQL索引数据结构入门详细教程
2024-01-25 02:02:42
一文详解如何创建自己的Python装饰器
2021-09-10 02:43:43