Using CSS you can set background of HTML
elements.CSS background properties are:
1. background-color
2. background-image
3. background-repeat
4. background-attachment
5. background-position
6. background
background-color
property is
used to set background color of a HTML element. Say suppose I want to set red
color as a background color of a web page. Then CSS property for this is :
body{
background-color : red;
}
background-image property is used to set image as a background of a HTML element.
Say suppose I want to set image (favicon.jpg) as a background of a web page(favicon.jpg image is in same folder as web page). The
code is given below:
body{
background-image:url('favicon.jpg');
}
Another working example is given here
background-repeat
By default image is repeated both
horizontally and vertically(background-repeat : repeat;).
If you don’t want image to be repeated
then put background-repeat : no-repeat;
View example here
Background image can be repeated only
horizontally(background-repeat : repeat-x;).
View example here
Background image to can be repeated only
vertically(background-repeat : repeat-y;).
View example here
background-attachment
This property is used to determine whether
image is fixed or scrolls with rest of the page.
If you want fixed background image then enter property background-attachment : fixed; Here is working example
If you want scrollable background image then enter property background-attachment : scroll; Here is working example
background-position
This property is
used to set position of an image.
See example here
Background
You can use all properties in one property
ie background
body{
background: url(‘favicon.jpg’) no-repeat
right top;
}
The order of the property values is background-color, background-image, background-repeat,
background-attachment and background-position. It does not matter if one of the
property values is missing but present ones must follow above order.