This techniques is know as
css-spirits. Where all images are combined into one image and call the same image all over the website if necessary. First you should know the advantage of using css-spirits.
1. Each images used in webpage is considered as a one
http request while loading.
2. Webpage load time depends on number of
requests in a page.
3. As the number of r
equests is less obviously page load time is less.
4. Also if you use multiple images they c
onsume more space, so better to
combine them into one.
Using css property called
background we can call images.
Ex:
body
{
background-image:url('smiley.gif');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
}
Note: You should know positions of each images while using.
See below links more details..
http://www.w3schools.com/cssref/pr_background-position.asp[
^]
http://www.w3schools.com/cssref/playit.asp?filename=playcss_background-position[
^]
http://css-tricks.com/css-sprites/[
^]
Hope this will helps you lot..