Есть ли способ повторить определенные пиксели в работе CSS спрайт

Question

вижу изображения в том, что оба градиента повторяются, я хочу повторить только оранжевый градиент мой код CSS: #header{background: url(images/background-spirit.png) repeat-x 0px -20px ;height: 50px;}

Answer 1

Нет ..

Невозможно повторить только часть фонового изображения ..

Вам нужно будет создать два разных изображения ..

---

Если у вас абсолютно есть для использования спрайта, как тот, который вы опубликовали, вы можете растянуть фон со свойством background-size, но у вас неточень точный контроль ..

например, следующее растянет изображение так сильно, что оно заполнит поле размером 500px

background-size:1000% 100%; 

демо при http://jsfiddle.net/gaby/V62j6/

( но для вашего случая использования вы должны просто создать два разных изображения )

Answer 2

Если ваш фон только использует repeat-x и имеет фиксированную высоту, то не могли бы вы поставить синий градиент под оранжевым?

Пример: http://jsfiddle.net/bZ7W5/

Answer 3

Если вы хотите только оранжевый, отредактируйте изображение и удалите синий: