Sprites

Uno sprite è un'immagine di grandi dimensioni che contiene molte piccole immagini simili a mappe. Gli sprite di solito includono icone e varie piccole immagini decorative.

Gli sprite sono utilizzati per ridurre il numero di richieste al server. Ogni piccola immagine è una richiesta separata, e meno richieste ci sono, meglio è. Pertanto, le piccole immagini vengono "incollate" in una grande.

Gli sprite possono essere raster o vettoriali. Prenderemo in considerazione gli sprite bitmap più semplici.

Gli sprite bitmap sono immagini in formato bitmap. Principalmente JPG e PNG.

L'immagine di una sprite bitmap è solitamente molto più grande dell'elemento a cui si vuole impostare lo sfondo. Pertanto, solo una parte dello sprite viene sempre visualizzata all'interno dell'elemento. L'immagine di sfondo viene spostata utilizzando la proprietà background-position per rendere visibile la parte desiderata dello sprite.

Guardate voi stessi come funziona.