使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
投稿
猜你喜欢
Asp 防止网页频繁刷新一法
2008-04-07 13:03:00
激发你的灵感:50个优秀的Favicons设计
2007-10-21 19:52:00
VBScript GetObject 函数用法介绍
2008-01-30 17:00:00
如何在网页上使用VBScript和JScript
2008-05-05 19:53:00
使用SQL Server时最容易忽略的21个问题
2009-01-13 13:59:00
Javascript操作cookie的类
2007-08-23 09:36:00
未能找到存储过程’master.dbo.xp_fileexist’解决方法
2011-03-13 09:29:00
FckEditor配置手册中文教程详细说明
2010-02-28 12:37:00
如何列出我所需要数据视图?
2010-01-12 20:00:00
用户体验之内容篇
2010-11-05 18:21:00
jQuery初学:find()方法及children方法的区别分析
2011-02-05 10:58:00
纠结于ajax开发中 response的contentType 问题
2008-12-11 13:46:00
asp检测表单输入EMAIL合法性的函数
2007-10-16 13:39:00
ASP环境中使用QQ纯真版IP数据库QQWry.dat
2010-02-26 13:35:00
编程活动中几个不良现象
2008-09-01 12:23:00
ASP新闻分页,将一篇过长的文章分页,生成静态页面
2011-04-10 11:14:00
Asp Oracle存储过程返回结果集的代码
2011-04-10 11:16:00
JavaScript链式调用的设计
2009-12-04 12:46:00
天气预报调用代码
2008-11-18 15:59:00
Oracle轻松取得建表和索引的DDL语句
2009-02-26 10:26:00