background image opacity css

Talha Baig answered on July 29, 2024 Popularity 9/10 Helpfulness 10/10

answer background image opacity css

background image opacity css

Comment

<!-- Nowadays, it is possible to do it simply
with CSS property "background-blend-mode"
and combining it with background-color -->

<div id="content">Only one div needed</div>
<style>
  div#content {
    background-image: url(my_image.png);
    /* For Light Image */
    background-color: rgba(255,255,255,0.6);
    /* For Dark Image */
    background-color: rgba(0,0,0,0.6);
    background-blend-mode: lighten;
    /* You may add things like width, height, background-size... */
  }
</style>

Popularity 9/10 Helpfulness 10/10 Language html

Source: stackoverflow.com

Tags: background-image css html opacity

Link to this answer
Share Copy Link

Contributed on Jul 29 2024

Talha Baig

0 Answers Avg Quality 2/10

background image opacity css

Contents

More Related Answers

background image opacity css

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.