为什么这个div继承了父母的不透明度?

时间:2010-11-12 15:18:12

标签: css z-index opacity

通常我会尝试在这里很好地记录这个问题,并复制一些代码,这样当我链接到的URL来证明问题不再导致任何问题时,至少问题会有足够的代码,所以以后读过这个可能有同样问题的人可以看到这个例子。但在这种情况下,我遇到的问题是如此具体......我不知道什么是错的,所以我不知道在这里复制什么代码。

我有一个div,不透明度设置为1,在另一个div中,不透明度设置为.5,以制作一个非常便宜的“灯箱”效果。至少在其他两个网站上,我完全按照完全相同的方式完成了这个问题,并且从未遇到过这个问题。事实上,如果我在Dreamweaver中打开一个新的HTML页面并尝试复制该问题,我就不能。我知道我必须忽略一些如此荒谬的简单但是......

有问题的网址为http://pmind.com/staging/123/dashboard.shtml

中间的白色框generate_window继承其父级(generate_window-wash)不透明度。

为什么?

3 个答案:

答案 0 :(得分:5)

父<{1}},包含其中的所有内容是透明的。

您不能在透明元素内部使用不透明元素。

相反,您可以将不透明的<div>置于透明的<div>之上,而不是孩子。

答案 1 :(得分:3)

具有不透明度的元素的所有子节点都会继承该不透明度。这是设计的。

您需要重新排列HTML,以便该项目不是孩子,但占据相同的位置。

答案 2 :(得分:0)

它不是从父母那里继承的。我在萤火虫中看到它显示了以下属性:

#generate_window {
background:none repeat scroll 0 0 #FFFFFF;
height:400px;
margin:200px auto;
opacity:1;
position:relative;
width:500px;
z-index:2000;
}