用CSS在IE中显示透明PNG图像

IE的IMG标签一直显示不了PNG图像的透明背景,前几天在蓝色理想看到一个解决的方法:使用AlphaImageLoader和Alpha滤镜通过CSS的方法显示透明的PNG图片

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<html>
<head>
<title>alpha image</title>
<style TYPE="text/css">
 .pngholder{
   width:100px;
   height:100px;
   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.misuisui.com/weblog/attachments/200510/03_124401_ie.png');
  }
 .pngalpha{
     filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
     background:url(http://www.misuisui.com/weblog/attachments/200510/03_124401_ie.png) no-repeat;
     width:100px;
     height:100px;
  }
</style>
</head>
<body  bgcolor="#3399ff#">
  <!- AND this is your code TO implement the image ->
  <div>透明</div>
  <div class="pngholder"><div class="pngalpha"></div></div>
  <div>不透明</div>
  <img src="http://www.misuisui.com/weblog/attachments/200510/03_124401_ie.png"/>
</body>
</html>

收藏自: 蓝色理想

用CSS在IE中显示透明PNG图像》上有 5 条评论

  1. ie的版本要全兼容工作量太大。现在只能考虑怎么用简单的方法做出华丽的页面

发表评论

电子邮件地址不会被公开。 必填项已用*标注