3 Replies - 314 Views - Last Post: 14 May 2020 - 03:15 AM

#1 HappyNewb   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 30
  • Joined: 28-April 20

Changing opacity for background image

Posted 04 May 2020 - 04:26 PM

Having a problem making a background image for my web page transparent.

if i call an image in my css body it displays, but if i make opacity 0.3 everything goes transparent.

i tried this:

html {
background: url(images/Desktopbg.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

but same thing

tried making a div with a class called backgroundimage but nothing displayed.

how can i do this?

or am i better off just making the actual image transparent?

Is This A Good Question/Topic? 0
  • +

Replies To: Changing opacity for background image

#2 modi123_1   User is online

  • Suitor #2
  • member icon



Reputation: 15741
  • View blog
  • Posts: 63,062
  • Joined: 12-June 08

Re: Changing opacity for background image

Posted 04 May 2020 - 04:30 PM

I would just cut out the possible issues with browser rendering and and tweak the image itself. Zero confusion on how things should render then.
Was This Post Helpful? 0
  • +
  • -

#3 HappyNewb   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 30
  • Joined: 28-April 20

Re: Changing opacity for background image

Posted 04 May 2020 - 05:01 PM

ok thanks man will do
Was This Post Helpful? 0
  • +
  • -

#4 danchy22   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 29
  • Joined: 27-April 20

Re: Changing opacity for background image

Posted 14 May 2020 - 03:15 AM

its because everything is within the <html > attribute so it will all go with it... you could do an inline-stylesheet but everything will over ride the content of the website as its all within it...
what you could do is have a Pseudo element so you have...

html {
}

html::after {
}



which in a way fakes it?

or yes render the image itself may be easier

This post has been edited by danchy22: 14 May 2020 - 03:17 AM

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1