September 1, 2013
Multi image in one image file
Monocular’s Question:
I’m fairly new in CSS web design. I found some website combine multi image in one image file. This is an example from Amazon :
http://g-ecx.images-amazon.com/images/G/01/x-locale/personalization/amznlike/amznlike_sprite_02._V196113939_.gif
And i really want to know how to do it in the best way. Is there any tool for combine image and get pixel position of each image to put them in CSS?
They are called CSS Sprites. You can google a lot of information. This techniques are used by most sites to reduce loading time. What you basically do is load one images in all the elements you want to load the images.
But you load them as their background images, thus enabling you to modifying their position. Thus making it possible to show different version of same images.
I dont want to tell everything so here is a futher read to get you started.