2 votes

Pourquoi et comment les images sont-elles conservées dans une seule image ?

J'ai remarqué que les sites ont récemment commencé à conserver les images en une seule grande image. Par exemple google.com

google

Nous voyons beaucoup de petites images sur le côté gauche. Mais il s'agit en réalité d'une seule image :

enter image description here

Comment ces images sont-elles découpées et montrées ? (firebug dit qu'il s'agit juste d'un élément avec une largeur et une hauteur, mais où et comment les positions X et Y sont-elles pointées ?)

Merci de votre réponse

4voto

Fender Points 2292

L'autre partie de l'image n'est pas affichée, car l'élément avec l'image en arrière-plan est exactement aussi grand que la partie de l'image souhaitée.

Essayez de changer les valeurs px dans le css dans la partie arrière-plan. vous devriez voir l'image se déplacer.

<span style="background-position:-20px -132px" class="micon"></span>

Voici la position d'arrière-plan utilisée pour cette image

3voto

James.Xu Points 3320

Cette technologie est appelée Sprite CSS . Pour réduire le nombre de connexions http nécessaires au chargement de plusieurs images. En général, c'est le concepteur qui s'en charge.

3voto

Haza Points 2136

C'est ce qu'on appelle " Sprites CSS ".

Il existe de nombreuses informations sur Internet à ce sujet. Dans un ordre aléatoire :

Et bien d'autres encore ...

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X