Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > Вёрстка веб-сайтов > как растянуть порезнанную катринку и по x и по y


Автор: supervladislav 23.12.2008, 23:38
Подскажите мне нужно растянуть эллемент и по x  и по у картинку  залитую градиентом 
900px на 4 px

Автор: Nikol 24.12.2008, 01:51
Имеете ввиду размножить бекграунд?
Код

background-repeat: repeat;

Автор: supervladislav 24.12.2008, 20:31
а как сделать так ,чтобы по у изображение копировалось ,а по x изображение просто увеличивалось на 100%

Автор: Nikol 24.12.2008, 21:14
Да вроде нет у бекграунда такого свойства, как ширина. Можно разделить картинку на 3 части: основную поставить посередине, а по краям сделать такие, чтоб можно было их размножить. Ну или только с одного края, смотря какая у вас картинка. В качестве примера, посмотрите, как я http://www.qds-team.com/ сделала хедер и футер.

Автор: supervladislav 24.12.2008, 21:47
картинка залита  градиентом)))и когда картинка копируется по x получается не очень красиво )))как бы её просто увеличить по x а по y размножить ,неучто никакого способа нет?)))
Вот чтобы такого небыло ,ну всмысле чтобы полоса заново не копировалась а растягивалась ,или в фотошопе какниить по умному замутить 
градиент

Автор: supervladislav 24.12.2008, 22:52
и кстате твой вариант неработает в хроме и сафари

Автор: webster 24.12.2008, 23:20
Вообще конечно дизайн может быть разным... и даже с градиентом по горизонтали (что уже само по себе необычно и необоснованно, хотя бы с т.з. читабельности текста на нем - должен быть явный контраст, здесь же мы видим переход от самого яркого - белого, до самого темного - синего). Так никто не делает.

Я по сути вопроса - надо сделать картинку - срезку бэкгроунда высотой 1px-4px и шириной = на какую вы рассчитаваете сделать сайт (в идеальном варианте она тоже должна быть ограничена, иначе читабельность информации сойдет на нет - слишком длинные строки). Использовать свойство background-position: 50% 0%; и background-repeat: repeat-y;

Автор: Nikol 25.12.2008, 05:11
Ага, вот как. Сделайте так: картинку отпозиционируйте к левому краю и размножайте только по вертикали. Кроме картинки задайте еще белую заливку. В таких случаях это делается именно так. Посмотрите на бокс с категориями на http://www.elitaqua.com.ua/-c-92_99.html. Когда категории раскрыты, картинка остается внизу, просто плавно переходит в основной цвет бокса.

Автор: supervladislav 26.12.2008, 13:57
спасибо 

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)