透明度功能对于CSS - 内格

透明度我很困惑紧靠HTML opacity功能的工作......假设有两个divs，一个在另一个里面，我申请opacity到外格，它会自动应用不透明内div也。我们怎样才能解开这个问题，就像不透明只能用于外层div一样？透明度功能对于CSS - 内格

伊夫使用的CSS代码不透明 http://jsfiddle.net/4uMdj/

来源

2012-08-01 Da Silva

如果您在外部DIV中使用background-color，则可以为其定义rgba值。像这样写：

.outer{ 
background-color: rgba(0,0,0,0.5); 
}

&为IE使用IE过滤

你可以从这里http://kimili.com/journal/rgba-hsla-css-generator-for-internet-explorer/

来源

2012-08-01 11:04:09 sandeep

检查这个例子http://jsfiddle.net/4uMdj/ – 2012-08-01 11:59:23

从#outer DIV删除不透明度。检查这个http://jsfiddle.net/4uMdj/1/ – sandeep 2012-08-01 12:12:24

如果你使用opacity应用于它的父元素不能撤消（增加）透明度嵌套元素。

尝试，而不是background: rgba(r,g,b, opacity)使用方法：这不会对嵌套元素应用不透明

来源

2012-08-01 11:03:01 fcalderan

.parent{ 
    position: relative; 
} 

.parent:before { 
    z-index: -1; 
    content: ''; 
    position: absolute; 

    opacity: 0.3; 
    width: xxpx; 
    height: xxpx; 
    background: ; 
} 

.child{ 
    Color:xx; 
}

来源

2012-08-01 11:03:33 Prashobh

如果你只设置颜色的更简单，使用更安全背景透明度，这将不会影响任何嵌套元素

.alpha 
    /* RGBa with 0.6 opacity */ 
    background: rgba(0, 0, 0, 0.6); 
}

来源

2012-08-01 11:03:55

如果你使用CSS，你可以使用RGBA生成IE您的RGBA过滤器，但你必须覆盖子元素的背景，因为否则它会从父DIV继承：jsfiddle example

CSS从例如：

.opacity { 
    background-color: rgba(0,150,0,0.2); 
    padding: 20px; 
    border: 1px solid #000; 
} 
.noopacity { 
    border: 1px solid #000; 
    background-color: #090; /*non alpha background*/ 
    padding: 20px; 
}

最简单的方式做跨浏览器的有效是在您需要的颜色和透明度，以创建一个1px的PNG文件，并使用下面的CSS：

.opacity { 
    background: url("path/to/your/1px/transparent/background/image.png"); 
}

，因为图像会很不习惯作为继承背景;）

（注：IE6默认情况下不支持PNG透明度）

来源

2012-08-01 11:40:59 r3bel

检查这个实例http://jsfiddle.net/4uMdj/ – 2012-08-01 11:59:46

透明度功能对于CSS - 内格

回答

相关问题