半透明div

Question

以下是代码：http://jsfiddle.net/F4sYM/

EDITED

以下是新代码：http://jsfiddle.net/F4sYM/5/

我在#header重叠时尝试移除#main不透明度。

由于我使用的是使用background-size属性的图片，因此我无法在#main内创建另一个div。

示例：

有办法吗？

感谢。

Answer 1

不透明度是继承的，不能简单地删除。

.notranscolor -> opacity: 0.5 * 1.0 = 0.5

解决方案：

绝对定位内容。

Answer 2

使用

background: inherit;

表示#main div。您还可以明确指定任何其他背景颜色。

http://jsfiddle.net/F4sYM/3/

编辑：

去除

position: relative;

对于#main div似乎已经完成了。

http://jsfiddle.net/F4sYM/7/

编辑2：

使用3个div的解决方案：

http://jsfiddle.net/7e3BG/

Answer 3

我想知道你究竟需要实现什么...... 您是否有机会快速制作想要实现的结果的屏幕截图？

检查此 fiddle ，即使我认为这不是你想要的......

我刚刚还原了索引

z-index: 0;