AVProg

Как растянуть фоновую картинку по вертикали в background-image в CSS? #339993


#0 by Гений 1С
Нашел, что можно поставить фоновую картинку, а как ее растянуть на весь контейнер (фон задается для тега TD)? Не повторять, а именно растянуть по вертикали?

#1 by Гений 1С
ап

#2 by Гений 1С
ну блин, ап.

#3 by Fragster
не растянуть. можно к низу прилепить, или «замостить» то, что тебе нужно делается через img с абсолютной позицией размером 100% на 100% и z-index = -1

#4 by Fragster
только там со скроллингом нужно бороться

#5 by Гений 1С
так, что нельзя Image растянуть на всю ячейку TD средствами CSS или пусть даже в HTML коде???

#6 by Fragster
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <title>Untitled Document</title> <style type="text/css"> .bg {    position: fixed;    z-index: -1;    height: 100%;    width: 100%;    top: 0px;    right: 0px; } </style> </head> <body> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p>Превед!</p> <p><img src="moskow.gif" class="bg"/> </p> </body> </html>

#7 by Fragster
а в ячейку таблицы - меняй position

#8 by Гений 1С
Мне нужен фон ячейки таблицы, а не на весь экран.... У меня в картинке градиентный переход по вертикали, размер ячейки я заранее не знаю, мне надо ее растягивать по вертикали. Есть тег <td class="back1_for_logos">1S</td> Как мне поставить фоновую картинку??? Твой метод не годится, какой position, откуды я знаю позишн? .back1_for_logos  /*** Background with logotype of 1s ***/ {    background-image: url(/images/logos/top_backgroung.gif);    background-repeat: repeat-x;    background-position: left top; }

#9 by SeStyle
1. в css вродь не делается такое; 2. не красиво (лепить градиент); 3. если сильно хочется, сделай картинку ширина 1px высота 600px допустим, и делай сделай ее фоном с повтором по ширине ) 4. вариант поработать со слоями

#10 by Гений 1С
Почему некрасиво??? Если я сделаю очень большую картинку, то у меня будет не весь градиент показан по идее. Неужели такую простую вещь нельзя просто сделать. Пусть не CSS-ом, а в коде?

#11 by Fragster
position: fixed / relative / absolute, иль как там их, имею ввиду! тогда left0top0 - может быть координатами угла текущего блока

#12 by Гений 1С
тег BG относится ко всему документу. а мне нужно чтобы бэкграунд применился только к одной ячейке, секешь???

#13 by Гений 1С
апну, ибо актуально. Пока выкрутился, растянув картинку в графическом редакторе до нужного размера, но это же маразм.

#14 by Гений 1С
аппну, ибо босс рвет и мечет

#15 by TitanLuchs
Смотри, как сделано здесь: ячейка с контентом "обрамлена" "резиновой" таблицей, рамка содержит фоновый рисунок с "краями". Все растягивается.

#16 by Fragster
там repeat-x и repeat-y стоит. как я понял - не то

#17 by TitanLuchs
Пусть скажет, что надо-то. Мож другими способами можно сделать Гений, а что надо получить в итоге?

#18 by Fragster
как я понял - чтобы фоновая картинка растягивалась на всю величину ячейки таблицы, а не «мостила» ее, как происходит, если делать repeat

#19 by TitanLuchs
Это он способ такой предлагает. А мож на самом деле просто рамку красивую охота, а это другими способами лечится. Насколько знаю, решить этот вопрос средствами CSS нельзя, тут надо JavaScript юзать и по событиям отлавливать измение размера ячейки и менять размер картинки соответственно. Слоями поиграться надо.

#20 by Fragster
ну я примерно такой вариант в предложил. потом гений все-таки сказал, что для ячейки. потыкал минут 5, не получилось и забил. ну да гений любит всякие методы решения задачи... скажем так, нетрадиционные

#21 by TitanLuchs
Эт верно. Че-та пропал он, наверно босс таки его изловил, порвал и разметал.

#22 by Гений 1С
Да блин, уже говорил. Есть картинка (градиентная заливка от желтого до оранжевого сверху вниз) высотой 70 пикселов. Нужно ее натянуть на TD. Высота TD заранее неизвестна. Если я ставлю repeat-y, то градиент нарушается - она тупо повторяет по вертикали. Нужно, чтобы растягивала по вертикали. Банальнейшая задача, как решить не знаю. Дошел до того, что хочу тупо поставить высоту TD в 100 и растянуть в редакторе картинку до 100, но это идиотское решение ситуации.

#23 by Гений 1С
Жава скрипт не годится...

#24 by Гений 1С
Если CSS этого не умеет, то я ваще молчу... Блин, банальнейшая задача...
Тэги:
Ответить:
Комментарии доступны только авторизированным пользователям
Регистрация

Похожие вопросы 1С

В этой группе 1С