CSS allows you quite a bit of control over your page's backgrounds. Most basic, it allows you to change the color, and on the most complex end, it allows you to set a fixed image aligned in a particular way as your background. On this page, I'll explain the different background attributes, but I'll leave the examples for you to try. (It shouldn't be hard, just create a page with lots of filler text so you have a scrollbar & try changing the attributes and values around).
Is the most basic background option, that is the code currently applied to this page - thus, we have a black background. However, background codes can apply to lots of things, not just page bodies. For example:
This is my h2.
However, solid color backgrounds aren't too interesting, so the rest of these codes apply to background images, starting out with the most basic...
background-image: url('url goes here.jpg');
Additionally, using the following values, your background image can be positioned and manipulated. Try experimenting!
background-image: url(url goes here.jpg);
background-attachment: scroll; /* values: scroll, fixed */
background-repeat: no-repeat; /* values: repeat, no-repeat, repeat-x, repeat-y */
background-position: top left; /* values: any combination of top/center/bottom & left/center/right
or any percentage, like 50% 50%. For this to work,
the background must be non-repeating and fixed! */
Next Page >>