我们在做网页时,经常碰到想在页面某位置加入广告,但又不想它看上去太突出,所以可以用到下面的效果。
正常显示半透明,当用户鼠标移动到广告上时,100%不透明显示。
效果图:正常显示:
鼠标悬浮table或div上
实现代码:
- <style type="text/css">
- .zqm tr td{opacity: 0.3;filter: alpha(opacity=30);} /*正常显示透明度为30%*/
- .zqm tr td:hover{opacity: 1;filter: alpha(opacity=100);} /*鼠标悬浮,显示为不透明度100%*/
- </style>
- <table class="zqm" width="950">
- <tr>
- <td><font color="FF8C00">欢迎来到</font>
- <a href="http://bbs.zhise168.com"><font color="ff0000">自由者CG网</font></a>
- <b><a href="http://bbs.zhise168.com/thread-16-1-1.html" target=_blank><font color="FF33FF">点这里免费得金币</font></a></b>【<font color="#CCCCCC">这是默认签名,</font><a href=/home.php?mod=spacecp&ac=profile&op=info target=_blank><font color="ff0000">更换签名点这里</a></font>】
- <p><b><a href="http://bbs.zhise168.com/type-55-4-1.html"><font color="ff0000" size="+2">举报无效资源和链接有奖</font></a></b></p>
- </font></td>
- </tr>
- </table>
复制代码
|