Как повторить только одну части моих спрайтов изображения в качестве фона для DIV

Question

мне нужно поставить одну только одну часть моих спрайтов в качестве сНа фона, но результат таков:

И я притворяться так:

мне нужно использовать только один спрайты в моем шаблоне (требование от моего босса). Мне нужна помощь для этого.

Мой HTML:

<div class="background"></div> 

Мой Css:

.background {width: 100%; 
      height: 166px; 
      background-size: 93px 166px; 
      background: url('library/images/sprites.png') -150px 0px repeat-x; 
      } 

Answer 1

Повторить спрайт можно только в одном направлении.

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

Тогда код, который вы предоставили, должен работать (изменяя положение в соответствии).

Answer 2

К сожалению, вы будете иметь, чтобы сделать отдельный файл, если вы хотите повторить оба х и у. Если вы хотите x или y, вы можете использовать приведенное ниже, чтобы помочь вам ответить here.

repeat-X: вы можете складывать их по вертикали в лист спрайта. У вас может быть только одно изображение на «строку». Все изображения должны иметь ту же ширину .

repeat-y: Вы можете вырезать изображения по горизонтали и иметь только одно изображение на «столбец». Все изображения должны иметь одинаковую высоту.

Это не должно повредить время загрузки слишком много!

Answer 3

http://cssspritegenerator.net - хороший инструмент, который поможет вам в этом, вы можете либо повторить x, либо y и сделать это для любого количества изображений, которое вы хотите.