[解決済み] CSS 背景の不透明度 [重複]について

質問

私は以下のコードに似たものを使っています。

<div style="opacity:0.4; background-image:url(...);">
    <div style="opacity:1.0;">
        Text
    </div>
</div>

私はこれで背景の不透明度が0.4になり、テキストの不透明度が100%になると思っていました。しかし、両方とも不透明度が0.4になっています。

解決方法は？

子供は不透明度を継承する。そうしないと奇妙で不便です。

背景画像に半透明のPNGファイルを使用するか、背景色にRGBa（aはアルファ）色を使用することができます。

例、50%退色した黒背景。

<div style="background-color:rgba(0, 0, 0, 0.5);">
   <div>
      Text added.
   </div>
</div>