a:hover{background:#000;opacity:05;color:#fff;display:block;}
这里只是把全部都写在一起了， 具体还要根据你表格的选择器来写！ 要设置透明度 就用CSS的opacity设置！ 字体颜色就是用color!
在一些网站的登录页面上，经常可以发现，一张叠加在另一张上，底层的若隐若现，利用css中的透明属性opacity可以实现这种效果，下面就简单介绍一下怎么写代码
01新建一个HTML文件，下载两张，如下图，放在一个文件夹中，避免出现路径问题
02代码示例如下，主要利用css伪元素::before，F_box为前置层，浮于背景上方
03下面简单分解下代码，分为1，2，3，第一部分，设置背景001jpg；第三部分，固定前置层002jpg的位置；第二部分，利用伪元素：：before，设置属性opacity来调节透明度，取值为0-1，0是全透明，即看不见的效果，1是全不透明
04代码示例中，设置opacity为05，半透明状态，实际页面效果如下
<!DOCTYPE html><html>
<head>
<meta charset="utf-8" />
<title>半透明实例</title>
<style>
div-a{ background:url(1jpg) no-repeat;width:230px;height:136px;padding:10px}
div-b{ background:#000;width:200px;height:100px;padding:5px;color:#F00;
filter:alpha(Opacity=60);-moz-opacity:06;opacity: 06}
</style>
</head>
<body>
<div class="div-a">
<div class="div-b">实现DIV半透明实例演示</div>
</div>
</body>
</html>
给个模板给你。1jpg就是背景。filter:alpha(Opacity=60);-moz-opacity:06;opacity: 06这段就是控制透明度的，60%的透明度。
<style type="text/css"><!--
body {
background-image: url(”地址“);
background-repeat: repeat-x;
}
#div1 { margin:0px auto; width:500px; height:370px ; text-align:center; background:url(/jscss/demoimg/wall3jpg);}
#div2 { height:330px; filter:alpha(Opacity=80);-moz-opacity:05;opacity: 05;z-index:100; background-color:#ffffff; }
-->
</style>
横向平铺背景。
div透明度，继续参考下面代码
<div id="div1">
<div style="padding:20px;"><div id="div2">这里是透明的DIV</div></div>
</div>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）