Image SpritesAn image sprite is a collection of images put into a single image. A web page with many images can take a long time to load and generates multiple server requests. Using image sprites will reduce the number of server requests and save bandwidth.Image Sprites - Simple ExampleInstead of using three separate images, we use this single image ("img_navsprites.gif"): With CSS, we can show just the part of the image we need. In the following example the CSS specifies which part of the "img_navsprites.gif" image to show: Exampleimg.home { width:46px; height:44px; background:url(img_navsprites.gif) 0 0; }
