Background Properties

Comments:  These properties let you control the color and background of elements. Property Description Values Example color

Sets the color of the element. color name
hex value
rgb(R%, G%, B%)
rgb(R, G, B) p {color: red}

Displays the paragraph text in red. background-color

Sets the color for the background of the element. color name
hex value
rgb(R%, G%, B%)
rgb(R, G, B) H1 {background-color: green}

Displays the background area of all level one headlines in green. (The effect is like having a green bar behind the headline.) background-image

Specifies an image to use for the background of an element. url(URLname) blockquote {background-image: url(..images/sand.gif)}

Displays the image "sand.gif" in the background area of the blockquote. background-repeat

Specifies how and if a background image is repeated. repeat
repeat-x
repeat-y
no-repeat blockquote {background-image: url(..images/sand.gif); background-repeat: repeat}

Displays the image "sand.gif" in the background area of the blockquote and repeats the image vertically and horizontally to fill the entire background area. background-attachment

  Lets you attach the background image so that it doesn't scroll. scroll
fixed blockquote {background-image: url(../images/sand.gif); background-attachment: fixed}

Displays the image "sand.gif" in the background area of the blockquote and prevents the image from scrolling. background-position

  Sets the initial position of the background image. vertical %
horizontal %

---

top
center
bottom
left
center
right body {background-image: url(..images/sand.gif); background position: center center}

Centers the background image vertically and horizontally on the initial body screen.