CSS Home

Background Formatting with Cascading Style Sheets

Cascading Style Sheets provide many different options for background formatting. Backgrounds may be either full pages or boxes.

background: This specifies the background of a page or a box in the order color, image, repeat, attachment, position. The last three parameters relate to background images. For example, background:white url(logo.gif) no-repeat fixed center center; produces a white background with logo.gif centered on it without repeating or scrolling. Note that position is two parameters; horizontal and vertical.

background-attachment: This specifies whether a background image scrolls with the page or not. Options are scroll or fixed.

background-color: This specifies the color of the background. Colors may be either named or specified as #rgb, which are the red green and blue values in hexadecimal.

background-image: This specifies the url of a background image.

background-position: This is two parameters, the horizontal position and the vertical position, of the background image. Options for the horizontal position are right, left and center, or it can be specified in % or pixels from the top left. Options for the vertical position are top, bottom and center, or it can be specified in % or pixels from the top left.

background-repeat: This specifies whether the background image is repeated. Options include repeat, no-repeat, repeat-x and repeat-y.

©2003 All Rights Reserved