导航

复制本文网址 | 上一篇 | 下一篇 | 返回日志列表

一个半透明背景色或图片的CSS

在移植百度空间那个皮肤的时候,发现一段半透明效果,是用CSS实现的哦,还支持Firefox 2.0,至于是否通过w3c就没管了。

主要CSS:opacity:0.5;  //0.5为半透明,1为不透明,自己想要多少透明就自己设置吧。不过使用前,要加上背景色,因为这个是针对背景色进行透明的。用起来超级简单,副作用只知道一个,设置了这个就不能放背景图,否则这个无效;其它还未通过实际检验。

----------------7月3日补

谢谢评论一楼的指出,是我的疏忽,opacity是CSS 3提出的(看来能通过w3c),IE都不支持(该死的IE),要实现同样效果,IE得用 filter:alpha(opacity=50); 来进行解释。搜索到一篇相关例子,是用在图片上的。

代码如下(不加moz相关一般都没问题):
<img src="powerbookg4.jpg" style="
-moz-opacity:0.5;   //ff和oper等浏览器下的半透明
filter:alpha(opacity=50);  //IE下的半透明
" onmouseover="this.style.MozOpacity=1;  //鼠标放上去时候显示为不透明
this.filters.alpha.opacity=100"
onmouseout="this.style.MozOpacity=0.5;  //鼠标离开时候恢复到半透明
this.filters.alpha.opacity=50"
>

  • 2008-7-1 14:1:42  CSS   
评论列表
共2篇评论
  • 1楼   a0327    2008-7-2 18:07:21   
  • 好像IE6/IE7都不支持啊
  • 2楼   星铃丹  http://yyld.net   2008-7-3 8:30:40   
  • 谢谢指出,已找到解。

发表评论

☆温馨提示:为防spam,评论禁止了网址相关内容,如想发自己的网站,请往网址专用输入框里放 ^_^

Powered By Z-Blog | YYNote Design By 星铃丹 | 摇曳铃丹 版权所有 YYLD.net

Copyright xxxx-xxxx Your WebSite. Some Rights Reserved.