Background-Image Opacity

b3u · July 19, 2018, 4:24pm

I am working on revising my website, and I am trying to make the hero image opacity .5 without changing the children’s opacity. Is there a css workaround for this?

s_coder · July 19, 2018, 4:30pm

I have tried this on my projects too.
Opacity applies to the entire element. You cannot apply opacity just to the background image. You can use a pseudo element with opacity applied and insert it behind the div and put the background image on this div. See CSS Tricks as an example:

I like your portfolio so far.

b3u · July 19, 2018, 4:32pm

Thanks. I might also just edit the image itself.