Que es CSS Sprite y las mejores herramientas online para generarlos
El concepto de w3schools : Un sprite de imagen es una colección de imágenes puestas en una sola imagen . Una pagina web con muchas imágenes puede tardar mucho tiempo en cargar y generar varias solicitudes de servidor. El uso de Sprites de imagen reducirá el numero de solicitudes de servidor y ahorrara ancho de banda. Un ejemplo en imágenes: Como el concepto anterior lo indica consiste en una colección de imágenes agrupadas en una sola, y que a través de código CSS podemos hacer ir recorriendo cada una de esas imagenes y hacer uso de las que necesites. Un ejemplo real: Imagen Sprite: Código CSS: .sprite { background-image: url(spritesheet.png); background-repeat: no-repeat; display: block; } .sprite-Arrow { width: 19px; height: 20px; background-position: -5px -5px; } .sprite-ArrowWhite_Next { width: 24px; height: 39px; background-position: -34px -5px; } .sprite-ArrowWhite_Prev { width: 24