CSS спрайты и градиенты

Question

Можно ли поместить несколько повторяющихся градиентов на одно мастер-изображение спрайта? У меня есть около 5 градиентов размером 1px X 400 px, которые можно объединить, чтобы уменьшить количество запросов страниц. Это мое последнее место для сокращения количества запросов к объектам. Я не видел никаких методов для этого во время поиска. Мои собственные эксперименты не дали хороших результатов.

Answer 1

Предполагая, что все области, к которым вы применяете градиенты фона, имеют высоту менее 400 пикселей, вы можете расположить пять спрайтов по вертикали, чтобы получить одно изображение размером 1x4000 пикселей.

Вы можете применить соответствующую часть спрайта, указав вертикальное смещение и установив background-repeat:repeat-x.

Вертикальное смещение будет 400 * (index of the sprite you want): 0px для первого, 400px для второго, 800px для третьего и т. Д.