How to fade the background image??

Answer 1

background-image: url(my_image.png); background-color: rgba(255,255,255,0.6); background-blend-mode: lighten;

Answer 2

(Opacity would fade the content too!...)

Answer 3

use opacity.

Answer 4

The 'problem' of the 'opacity' css property is that it will be applied not only to the background, but all the content of the element targeted, what's not commonly expected... To work around, we need to use 'position' possibility, to handle in once container at least two layers objects (one background and another one foreground), to be able to set opacity on the background layer without affecting the foreground one.

Obviously, you can animate the 'opacity' property, with '@keyframes' and/or 'transition' css functionnalities:

https://code.sololearn.com/WlkjRum5ePcG/#css

Answer 5

do you know what "a" stands for hsla or rgba?
Just go and check out css lessons

Answer 6

exactly this dear @ValentinHacker