body {
background-color: #ffffff;
}

background-image

This property sets a background image for the relevant element:
body {
background-image: url(background_image.jpg);
}

By using this CSS, you end up with a tiled background,

background-repeat

The properties explored so far mimic the range offered by deprecated HTML attributes, but CSS provides you with control over the background’s tiling and positioning. The background-repeat property can take four values, the default of which is repeat, creating the tiled background.

background-attachment

This property has two possible values: scroll and fixed. The default is scroll, in which the background works as normal, scrolling with the rest of the page. If you set the value to fixed, the background image remains stationary while the remainder of the page scrolls.

background-position

This property’s values set the origin of the background by using two values that relate to the horizontal and vertical position. The default background-position value is 0 0 (the top left of the web page). Along with keywords (center, left, and right for horizontal positioning; center, top, and bottom for vertical positioning), you can use percentages and pixel values. It’s possible to use a combination of percentages and pixel sizes, but you cannot mix keywords with
either. Therefore, it’s recommended that designers stick with using percentages and pixel values—after all, keyword positioning can be emulated with numbers anyway (left top being the same as 0 0, for instance). When setting values, they should always be defined in the order horizontal-vertical. When using keywords, it’s also recommended to use the order horizontal-vertical, because both percentage- and pixel-based background positioning use this order, and it’s simpler to remember a single rule. In the following example, the background would be positioned on the left of the web page and positioned in the vertical center of the content:

body {
background-image: url(background_image.gif);
background-repeat: no-repeat;
background-position: left center;
}
Again, when using percentages or pixel values, the first value relates to the horizontal position and the second to the vertical. So, to create the equivalent of the keyword example, you’d use the following CSS:
body {
background-image: url(background_image.gif);
background-repeat: no-repeat;
background-position: 0 50%;
}
Note, however, when using background-position with the body element, that browsers disagree slightly on where the background should be positioned vertically if the page content isn’t taller than the viewing area. Internet Explorer and Safari assume the body is the full view area height when there’s no content, thereby setting an image with a
background-position value of 50% 50% directly in the center of the viewing area. Firefox and Opera instead assume the body has an effective height of 0, thereby placing the background vertically at the top of the view area (in fact, you only see the bottom half). For consistency across browsers in this case, you can define both background-position and
background-attachment (as fixed), although this means the background will not scroll with the page content.

Related posts:

1. Using Property Values Property values come in the following forms: constant text, constant...
2. The CSS box model explained The box model is something every designer working with CSS...
3. Using Shorthand Properties in CSS Your body rule should now look like this: body {...

Related posts brought to you by Yet Another Related Posts Plugin.