使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
  • asp之家 网络编程 m.aspxhome.com