Fun With CSS Backgrounds

Funny as it may be, I am most facinated by CSS backgrounds and all the cool stuff you can do with them.

Fixed backgrounds are really neat and with the right graphics can really give some fun effects to your page.

Lets look at the CSS background property...

background takes the following values:

background-color
background-image
background-repeat
background-attachment
background-position

background-color: this one is fairly basic. You can set the color to its RGB, HEX or name. Also takes transparent.

background-image: This takes the url to your background image

background-repeat: You can tell it to repeat, or not. Takes x, y and none

background-attachment: My favorite! This is what sets the background to scroll or not. Takes fixed or scroll. If you choose fixed, your background doesnt move with your page - neat!

background-position: This sets the position of the background image. Takes top left, top center, top right, center left, center center, center right, bottom left, bottom center, bottom right or x & y position. This is another handy way to do cool stuff with background images.