css – 当其父容器的不透明度为50时,如何保持文本不透明度100

我有一个列表div,其透明度设置为50,在这个div内,我想显示一些不透明度100的文本,

这里是我的意思:

<div id="outer">
  <div id="inner">
    Text
  </div>
</div>

CSS将是:

#outer {
  opacity: 0.5;
}

#inner {
  opacity: 1.0;
}

我尝试过,但它不行。

请帮忙

问候

解决方法

一个简单而兼容的解决方案是去除所有的不透明度,并使用:
#outer {
    background: url(50%-transparent-white.png);
    background: rgba(255,255,0.5)
}

>支持rgba的浏览器将使用带有rgba的第二个背景声明。
>浏览器that do not将忽略第二个背景声明并使用.png。

.png在IE6中不起作用,但这是unlikely成为一个问题。如果是,it can be resolved

另一种方法在这里详细说明:

http://robertnyman.com/2010/01/11/css-background-transparency-without-affecting-child-elements-through-rgba-and-filters/

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效