我怎样才能只设置 div 不透明度而不是文本? [复制]

Posted

技术标签:

【中文标题】我怎样才能只设置 div 不透明度而不是文本? [复制]【英文标题】:how can i set div opacity only not text? [duplicate] 【发布时间】:2014-02-20 20:51:25 【问题描述】:

我只想对 div 使用不透明度,而不是在文本上使用。我为 div 不透明度使用了一些代码,但它也显示了文本不透明度。我不想显示文本不透明度。我的代码在这里。

.opabenner 
width:569px;
height:100px;
float:left;
position:absolute;
background:#06F;
top:587px;
filter:alpha(opacity=60); /* IE */
   -moz-opacity:0.6; /* Mozilla */
   opacity: 0.6; /* CSS3 */
z-index:9999;
  
 .tit 
position: absolute;
font-size: 20px;
color: #FFF;
text-align: center;
padding: 5px;
width: 580px;
  


  <div class="opabenner"> 
         <h1 class="tit">Step inside love in 2014 and join today for FREE!</h1>
    </div>

【问题讨论】:

【参考方案1】:

为容器使用 RGBA 颜色

p
    color: red;


#transparent
    background-color: rgba(0, 0, 0, .1); /* 0.1 alpha = 10% opacity */

预览:http://jsfiddle.net/EfDZC/

【讨论】:

【参考方案2】:

使用background: rgba(0,0,0,.5); 删除opacity: 0.6;

Sample Demo

【讨论】:

是的,谢谢它的工作。但它适用于所有浏览器吗? @user3197474 : 我认为 ie 不支持... 谷歌是你的朋友:css-tricks.com/rgba-browser-support 还有:caniuse.com/css3-colors

以上是关于我怎样才能只设置 div 不透明度而不是文本? [复制]的主要内容,如果未能解决你的问题,请参考以下文章

设置一个DIV半透明,怎么才能使这个DIV中的其他DIV不半透明?

CSS 为 div 的背景颜色而不是内容添加不透明度

我怎样才能只闪烁背景而不是文本[重复]

css怎样仅设置div元素背景透明度,而不设置div元素里面元素的透明度

Firefox div背景颜色不显示,必须要在div中加入内容才显示。怎样才能不加内容就可以显示背景颜色

CSS - 低不透明度div上的不透明文本?