Search code examples
imageiconssprite-sheet

Multiple icons stored in one image file


Is it possible to store multiple small images or icons as parts of a single image, so that my webpage can get all the icons it needs from a single GET request. This would help my page load faster.

This is an example of the sort of composite image I'm referring to:

http://oi40.tinypic.com/2saaxac.jpg

It seems to me that it is some kind of array of images put into one file. I'm hoping there is some way that i can use each individual icon in the image in a project.


Solution

  • These are called sprite sheets, there's a great article about them on css-tricks that should help you understand how they work on the web.

    CSS Sprites: What They Are, Why They’re Cool, and How To Use Them