html - 如何去除透明色(不透明度)

标签 html css transparency opacity

<分区>

我有以下代码:

html...

<div id="solidcolor">
    <div class="transcolor">transcolor
        <div class="notranscolor">some text</div>
    </div>
</div>

CSS..

#solidcolor{
    background: url("http://i45.tinypic.com/o5aycp.gif") repeat; 
    width: 200px; 
    height: 200px;
}
.transcolor{
    background: blue; 
    opacity: 0.4; 
    height: 100px;
}
.notranscolor{
    background: red; /* I want this color to solid color not transparent color*/
}

DEMO

编辑说明 我不能使用 rgba() 方法设置它的背景颜色,因为我必须设置线性渐变颜色。

编辑1

即使在应用了绝对定位之后,我也无法找到合适的解决方案。但下一个想法我想用 calc() 方法来做到这一点,但它不会退出。有什么想法吗?

编辑2

由于@rokburgar 已经给出了答案,即使在应用绝对位置后我也无法解决我的问题。但是我想将不透明度设置为 1.25 我知道这应该是 0 到 1 但他已经声明 0.4 * 1.0 = 0.4 就像这样 0.8 * 1.25 = 1 那么为什么它不起作用?

最佳答案

不透明度是继承的,不能简单地删除。人们会期望您可以重置子元素的透明度。

你在这里的意思是:

.notranscolor -> opacity: 0.4 * 1.0 = 0.4

解决方法:

绝对定位子div的内容。

Transparency trick

关于html - 如何去除透明色(不透明度),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16129062/

相关文章:

javascript - 如何根据显示的结果更改 div 背景图像?

css - 是否可以使图像在渐变中透明?

javascript - IE8 和 IE7 的 onmouseover javascript 不透明度

html - 垂直居中 :after content in Bootstrap 3 panel-heading

javascript - 拉斐尔JS :Text around path not visible

css - 带 3 张图像的 Angular 旋转木马

css - Express static 不会从 root 加载 CSS 文件

cocoa - NSScrollview 和透明、覆盖 NSScroller 子类

html - 悬停 href 时链接仅下划线

android - 为什么移动版 Chrome 中的段落文本会缩小?