.home {}
img {
width: 100%;
padding: 0;
margin: 0;
display: block;
}
.wrap {
position: relative;
}
.wrap:before {
content: "";
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: rgba(0, 0, 0, 0.5);
z-index: 999;
} <div class="home">
<div class="wrap">
<img src="http://via.placeholder.com/350x150" />
</div>
</div> Reference: How to add color overlay on an image
Thanks for contributing an answer to Stack Overflow! Please be sure to answer the question. Provide details and share…stackoverflow.com