Creating an opaque background behind body

[Fish181]

Hi,

 

I want to put an opaque background behind my website that is a project for school. 

 

Here's my project for school:

 

http://gyazo.com/33eddfa1242478b0cdf53dbda114df5a

 

And what I want is an opaque background like the ones found on twitter:

 

http://gyazo.com/59afbe6c4fe9cba669acca916e547c8a

http://gyazo.com/55bfed8a0e2431d4acc02f41b72496eb

 

I'm a pretty big noob when it comes to this so any help would be greatly appreciated. 

[denno020]

Well from the Twitter images, it looks like you want the semi-transparent background? Opaque means you can't see through it, so either I'm confused as to what you want, or you're confused on the meaning.

 

Anyway, if you want the partially transparent background, then a very simple way to do it would be to give the div a background colour of white using the rgba setting:

 

#div {
  background-color: rgba(255, 255, 255, 0.5);
}

 

The 0.5 means it's 50% transparent. That will allow some of the background to show through, while still allowing the text to be read fairly easily, however you will have to play with the values to find the right balance.

 

Hope that helps,

Denno

[anilk]

You can make your website background opacity by the following code:

 

body {
opacity: 0.5;
filter:alpha(opacity=50);
}