How to Set The Opacity Of Body Background Image in CSS, HTML | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 1

How to Set The Opacity Of Body Background Image in CSS, HTML

how can I set or change the body background image opacity without affecting the content or you can say to keep the focus on the content and making the background more dark? I tried this in in CSS body { background-image;url("img url") opacity: 0.5; } but it changed the opacity of whole page including the content.

11th Oct 2017, 5:53 PM
Check My "Codes" N Join Me
Check My "Codes" N Join Me - avatar
3 Answers
+ 1
thanks, I've understood.
12th Oct 2017, 2:57 AM
Check My "Codes" N Join Me
Check My "Codes" N Join Me - avatar
0
div{ background-image:url("https://static.pexels.com/photos/20974/pexels-photo.jpg"); opacity:0.5; position:absolute; top:0; bottom:0; right:0; left:0; background-repeat: no-repeat; background-size: cover; z-index:-1; }
11th Oct 2017, 8:31 PM
林偉雄
林偉雄 - avatar
- 2
https://code.sololearn.com/W2fzI2WhflM6/?ref=app zindex is key to success other elements shouldn't wrap inside your image tag otherwise will effects by opacity
11th Oct 2017, 8:40 PM
林偉雄
林偉雄 - avatar