html - 半透明div

Question

这是代码：http: //jsfiddle.net/F4sYM/

已编辑

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

我试图在重叠#header时消除不透明度。#main

由于我使用的是使用background-size属性的图像，因此我不能只在#main.

样本：

有没有办法做到这一点？

谢谢。

Answer 1

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

.notranscolor -> opacity: 0.5 * 1.0 = 0.5

解决方案：

绝对定位内容。

Answer 2

利用

background: inherit;

对于#maindiv。您还可以明确指定任何其他背景颜色。

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

编辑：

去除

position: relative;

对于#main div 似乎已经做到了。

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

编辑2：

使用 3 个 div 的解决方案：

http://jsfiddle.net/7e3BG/

Answer 3

我正在尝试了解您到底需要实现什么......您是否有机会快速制作您想要实现的结果的屏幕截图？

检查这个小提琴，即使我不认为那是你想要的......

我刚刚恢复了索引

z-index: 0;