CSS Beginner tutorial 11 : Background Images

There are a number of properties involved in the manipulation of background images. But the property background can deal with them all. For example


body {
background: white url(http://www.yoursite.com/images/bg-image.jpg) no-repeat top right;
}


There are some other properties, which you can use instead using above single property. These properties are as follows.

• background-color
• background-image 
• background-repeat 
• background-position

The details of these properties are below.


background-color : 
It is the color of background.


background-image : 
It is the location of the image.


background-repeat : 
It will set, how the image repeats itself. This can be 

• repeat
• repeat-y         (repeating on the 'y-axis', above and below) 
• repeat-x         (repeating on the 'x-axis', side-by-side)
• no-repeat       (which shows just one instance of the image).

background-position : 
It can be top, center, bottom, left, right or any sensible combination, just like as above.

See Also