2013-10-15 4 views
0

У меня есть изображение шириной 99 пикселей и высотой 100 пикселей.Часть изображения фона с повторением-x

Изображение содержит 3 вертикальные линии цветов Красный, оранжевый, зеленый каждый из которых составляет 33 пикселя на 100 пикселей в этом изображении.

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

Так я сделал:

background-position: 66px 0px 

Проблема заключается в зеленый цвет все еще показывает я только хочу, чтобы показать оранжевый и повторить только ту часть. Возможно ли это в CSS?

+0

jsВстроить эту присоску вверх. – PlantTheIdea

+0

Использовать 'background-size' –

+1

Невозможно. Вам нужно отдельное изображение. – andi

ответ

2

Ответ - нет, а не x-браузер, если вы не пытаетесь повторить фон по вертикали для div/box шириной всего 33 пикселя. Если вы действительно хотите цветной фон, просто сделайте, например. {background-color:orange;}.

+0

Да, я могу сделать это вертикально, но не горизонтально. Удивленный, они еще не добавили поддержку! Спасибо за помощь :) – Sir

+0

Dave, вы можете сделать это по горизонтали, но вам понадобится фоновое изображение, например. оранжевую секцию так же широко, как и ваш контейнер (но она не должна быть такой высокой, в этом случае вы повторяете-y, чтобы заполнить ее по вертикали). – Madbreaks

+0

Идея заключалась в том, что полоса прогресса будет меняться по мере того, как она будет загружаться, поэтому мне придется иметь бок о бок элементы: (подумайте, что плохой для более простого метода! – Sir

Смежные вопросы