Answers for "how to give background image black overlay in css"

0

css background image black overlay

<style>
#wrapper{
  position:relative;
  width:fit-content;
  height:fit-content;
}

#overlay{
  position:absolute;
  top:0;
  width:100%;
  height:100%;
  z-index:1;
  background-color:black;
  opacity:.5;
}
</style>

<div id='wrapper'>
  <img src="https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/dog-puppy-on-garden-royalty-free-image-1586966191.jpg?crop=1.00xw:0.669xh;0,0.190xh&resize=640:*" alt="">
  <div id='overlay'></div>
</div>
Posted by: Guest on May-24-2021

Code answers related to "how to give background image black overlay in css"

Browse Popular Code Answers by Language