CSS - Backgrounds

This tutorial will teach you how to set backgrounds of various HTML elements. You can set following background properties of an element:

Background-color : property is used to set the background color of an element.
Background-image: property is used to set the background image of an element.
Background-repeat: property is used to control the repetition of an image in the background.
Background-position :property is used to control the position of an image in the background.
Background-attachment: property is used to control the scrolling of an image in the background.

The following is an example that shows how to set the background color of an element.
<p style="background-color:#0000FF;">
This text has a blue background color.
</p>

This will produce following result:

This text has a blue background color.

The following is an example that shows how to set the background image of an element.
<p style="background-image:url(http://www.blogger.com/img/logo40.png);">
This text has a background image set.
</p>

This will produce following result

This text has a background image set.

Repeat the background image:
The following is an example that shows how to set the repeat background image of an element.
<div style="background-image: url(http://www.blogger.com/img/logo40.png); background-repeat: repeat;">
This text has a repeat background image set.</div>

This will produce following result

This text has a repeat background image set.