UGA Boxxx

つぶやきの延長のつもりで、知ったこと思ったこと書いてます

【CSS】background-imageにオーバーレイしたい

ある要素にbackground-imageで画像を敷いているが、この画像を少し暗くしたい

元々は以下であるが、文字が白色なので画像を少し暗くしたいのが意図

いわゆる黒背景をオーバーレイをしたいのだが、どうやるか調べたところ、以下の記事が参考になった

css-tricks.com

結論こんな感じ

background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url("...");
background-position: center center;
background-size: cover;

これでやりたいことが実現できた