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

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

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

收藏自: 蓝色理想

相似日志:

Feed 发表评论 引用 Del.icio.us Google书签 Digg Live Bookmark Technorati Furl Yahoo书签 Facebook 百度搜藏 新浪ViVi 365Key网摘 天极网摘 和讯网摘 博拉网 POCO网摘 添加到饭否 QQ书签 Digbuzz我挖网

  1. 西崽猪猪 says:

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

    回复回复
  2. ray1980 says:

    本来就是解决IE中的问题,FF下支持透明PNG的啊

    回复回复
  3. hiswing says:

    调用了API,只对IE有用。

    回复回复
  4. 代码太多了

    回复回复

留下回复