filter:alpha如何只让背景透明，文字不要透明？
<p ><strong>liaodan11</strong> 发表于 2006-6-5 09:43</p>
<h3>filter:alpha如何只让背景透明，文字不要透明？</h3>我在DIV应用了filter:alpha(opacity=20)滤镜后，背景是透明了。可是DIV内的文字也透明了。在应用了滤镜的DIV里面再次插入一个DIV然后再输入文字也不行。
请问如何禁止文字的透明，而只要容器的背景透明呢？
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-image:url(img24.jpg);
}
-->
</style></head>
<body>
<div style="width:600px; height:300px; background-color:#0000FF;filter:alpha(opacity=20); border:1px solid #000000; padding:10px; color:#FFFFFF;"><div style="width:100%; color:red; background-color:#ffffff;filter:alpha(opacity=100);">透明的？透明的？透明的？透明的？透明的？</div></div>
</body>
</html><p ><strong>hutia</strong> 发表于 2006-6-5 12:24</p>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-image:url(img24.jpg);
}
-->
</style></head>
<body>
<div style="width:600px; height:300px; background-color:#0000FF;filter:alpha(opacity=20); border:1px solid #000000; padding:10px; color:#FFFFFF;"><div style="width:100%; color:red; background-color:#ffffff;filter:alpha(opacity=100); position:relative; ">透明的？透明的？透明的？透明的？透明的？</div></div>
</body>
</html>
<p ><strong>8acao</strong> 发表于 2007-5-9 11:39</p>
<h3>这个问题解答的不彻底</h3>这个问题解答的不彻底，在firefox里面还是不行！！！<p ><strong>myloadin</strong> 发表于 2010-2-4 04:13</p>
做一个不带文字的透明层.然后再做一个只有文字的层.一切就OK了<p ><strong>km268</strong> 发表于 2010-2-4 11:43</p>
換种寫法用定位吧：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
.a{filter:alpha(opacity=50);-moz-opacity:0.5;opacity:0.5;width:500px;height:300px;position:absolute;z-index:9;top:0;left:0;background:url(http://bbs.blueidea.com/images/default/logo.gif) #9C0;}
.b{filter:alpha(opacity=100);-moz-opacity:1.0;opacity:1.0;width:300px;height:150px;position:absolute;z-index:9999;top:20px;left:20px;background:#999;}
.c{filter:alpha(opacity=70);-moz-opacity:0.7;opacity:0.7;width:200px;height:80px;background:#999;position:absolute;z-index:-999;left:300px;top:200px;border:3px solid #000;}
</style>
</head>
<body>
<div class="a">這是背景層</div>
<div class="b">這個不是透明的</div>
<div class="c">這個是半透明的</div>
</body>
</html>
页:
[1]