Где объявить / загрузить спрайты фонового изображения для CSS, чтобы он загружался только один раз? - PullRequest
0 голосов
/ 16 ноября 2010

Я хочу использовать один спрайт изображения для моей веб-страницы, где я должен объявить это в CSS?
Это должно быть в теле или где?

Пример:

body
{
   background-image:url(/img/sprites.png);
}

#someDiv
{
   background-position: -10px -20px; /* can I do this? */
}

#someOtherDiv
{
   background-position: -30px -40px; /* and this? */
}



Я не пробовал этого, потому что сначала хочу узнать, возможно ли это, тогда я создам свои спрайты.

Спасибо

1 Ответ

2 голосов
/ 16 ноября 2010

Вы просто ссылаетесь на одно и то же изображение для каждого селектора:

a.myLink
{
   background-image:  background-image:url(/img/sprites.png);
}

a.myLink:hover
{
   /*you don't need to re-define styles for hover elements, unless you want them to change*/
   background-position: -50px 0;
}

#someOtherDiv
{
   background-image:  background-image:url(/img/sprites.png);
   background-position: -130px -40px; /* and this? */
}

В CSS нет "глобального включения", просто укажите его в каждом селекторе.Он будет загружен только один раз:)

...