html - 半透明の div

Question

コードは次のとおりです。http://jsfiddle.net/F4sYM/

編集済み

新しいコードは次のとおりです: http://jsfiddle.net/F4sYM/5/

重なった#headerときに不透明度を取り除こうとしています。#main

プロパティを使用する画像を使用しているためbackground-size、 内に別の div を作成することはできません#main。

サンプル：

それを行う方法はありますか？

ありがとう。

Answer 1

不透明度は継承され、単純に削除することはできません。

.notranscolor -> opacity: 0.5 * 1.0 = 0.5

解決：

コンテンツを絶対に配置します。

Answer 2

使用する

background: inherit;

分割用#main。他の背景色を明示的に指定することもできます。

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

編集：

削除する

position: relative;

for #main div はそれを行ったようです。

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

編集2：

3 div を使用したソリューション:

http://jsfiddle.net/7e3BG/