画像の上に背景色つき文字をいれたい

Question

サイトのヘッダーに画面いっぱいの大きな画像をいれ、
その上に背景色つきの文字をいれて、文字の背景色はopacityで薄くしたいのですが、
文字と一緒に薄くなってしまいます。
どうすればいいでしょうか？

画像はcssでバックグラウンドイメージでいれるのではなく、htmlで直接いれたいところです。
（jqueryでスライドショーを組み込むとき、htmlで画像がある場合しかやり方がわからないため）

Comments

[defghi1977]

https://teratail.com/help/question-tips

[kei344]

書かれている状況が再現するコード（HTML/CSS/JavaScriptなど）か、再現するURLを提示されたほうが回答を得やすいと思います。

Answer 1

ちょっと何を言ってるのか判らんのですが, opacityによるノード全体の透明化ではなく, rgba関数を使ってアルファ値を持つ色を背景色に指定すればよいのでは?

div{
  background-color: rgba(255,255,255,.5);
}