スタイルシートで背景色の上に文字を入れたい。でも、そのままだとテキストが見にくくなってしまうから、画像の上に色を重ねたい、そんなときにCSSで解決させる方法についてお話します。 背景画像の上に背景色を重ねる方法 backgroundプロパティは、背景画像か背景色のどちらか1つしか指定できませんので1つのbackgroundプロパティだけだと対応できません。そのため、次のような方法をとります。 本来の要素には背景画像・その疑似要素::beforeもしくは::afterに背景色を入れる ボタンで表示を切り替えてご覧ください。 See the Pen background-img-color by kenichi (@ken81) on CodePen. HTML <div class="bg_img"> <p>あなたの<br>オフィスに<br>革命を</p> </div> CSS .bg_im