Растянуть background css: Как растянуть фон на всю ширину окна? — Независимое театральное объединение "Зрительские симпатии"

Содержание

Вёрсточный кретинизм: Как растянуть на весь родительский ? | PHPClub

xintrea

Новичок

20 Апр 2013

...
     <td>
      <a href="<? echo $backUrl ?>">
       <div>Взад</div>
      </a>
     </td>
...

20 Апр 2013

20 Апр 2013

20 Апр 2013

<html> <head> <style type="text/css"> *{ outline: 1px solid red; padding: 5px; } td{ /*height: 100px;*/ background: darkseagreen; } .test{ height: 150%; background: orange; } </style> </head> <body> <table> <tr> <td><div>Привет мир!</div></td> </tr> </table> </body>
Redjik
Да, но ты тут таблице установил размеры. не важно что значит относительно остального контента эти размеры, но теперь внутренности будут отталкиваться от размера таблицы, который уже расчитан.
Я больше доверяю вот http://events.yandex.ru/events/shri/msk-2012/talks/561/ этому докладу В начале ясно рассказывается о том, что нужно родителю задать размер, и только потом проценты начнут работать)
ТС советую посмотреть весь курс. Думаю любой найдет для себя что-то интересное)
Backgorund — один из первых элементов дизайна сайта. Создание фона для сайта должно происходить в совокупной прорисовке всего дизайна в графическом редакторе.
Но иногда бывают случаи, когда срочно нужна фоновая подложка. Для таких случаев и для новичков в веб дизайне предлагаю подборку online сервисов по фонам (Backgorund).
background-size, появившееся в css3. позволяет растянуть фоновое изображение до нужного размера (можно задавать значения в пикселях, в процентах от контейнера, чьим фоном оно является, «уместить» его в данный контейнер (cover), а также растянуть по высоте или ширине контейнера(contain).
Если вы хотите поместить любое изображение на задний план, это довольно просто. Если вы хотите сфокусироваться на какой-то точке изображения, которая немного усложняет код CSS. Если вы хотите манипулировать размером, это более сложно. Учитывая, что ни одно изображение не может соответствовать всем размерам экрана.
Это связано с тем, что фоновое изображение имеет масштаб по умолчанию. Мы можем захотеть изменить его размер, чтобы он выглядел хорошо, по крайней мере, на рабочем столе. Вот как это выглядит после использования размера фона.
Фоновый размер может иметь фиксированный или процентный размер. Это позволит растянуть изображение. Любите это, ненавидьте это, есть метод, чтобы нарушить соотношение сторон, если вы хотите его использовать. Это не всегда хорошо выглядит.
Все методы, которые применимы к телу, глобально применимы для любого элемента, например набора логотипов. Возможно, нам придется использовать размер в процентах, чтобы изображения, такие как логотипы, не обрезались из-за размера фона.
ответ зависит. Если оно содержится в каком-то контейнере, сохраняющем соотношение сторон, изображение будет хорошо выглядеть на всех устройствах. Однако, если изображение используется в качестве украшения фона, оно может быть обрезано в зависимости от размера области просмотра.

Растянутый фон и множественный фон — HTML и CSS — Форумы SitePoint

бхакундай 9 апреля 2013 г., 14:13 1

Здравствуйте,
Как разместить несколько фонов? Я попробовал способ w3school, но не получилось. Также я хотел бы знать, как можно растянуть фоновое изображение, чтобы оно соответствовало любому разрешению, например, на twitter.com.
Заранее спасибо.

ПолОБ 9 апреля, 2013, 14:41 2

Вам придется быть более конкретным, так как вопрос довольно неоднозначный.

Если вы говорите об изображении облака в твиттере, то это просто большое изображение, которое можно повторять по мере необходимости. Растяжки как таковой нет.

Вы можете растягивать фоновые изображения с помощью background-size в браузерах с поддержкой css3, а также использовать [URL=»http://www.css3.info/preview/multiple-backgrounds/»]несколько фоновых изображений для одного и того же элемента, но вы необходимо [URL=»http://caniuse.com/»]проверить поддержку.

Нам нужно знать больше о том, что вы хотите помочь

bhakunday 9 апреля 2013 г., 15:27 3

Не облако twitter.com. Я говорил о bg-изображении на главной странице twitter.com. У меня код

#bgwrap{ фон: url(../img/bg1.jpg) без повтора 0px 0px; размер фона: обложка; минимальная ширина: 960 пикселей; максимальная высота: 700 пикселей; }
Размер фона: обложка; было достаточно хорошо, но когда я уменьшаю масштаб, изображение остается таким же. Не лучше бы бг-изображение тоже уменьшилось в размерах(но да пропорционально с другими элементами )
PS: Размер изображения 1600х1020
PaulOB 9 апреля 2013 г. , 18:56 4
Привет,
«Обложка» гарантирует, что изображение всегда покрывает доступное пространство, но даже если вы уменьшите масштаб, фон по-прежнему будет шириной 100%, поэтому он не может ничего сделать больше, чем он уже делает без части изображения. пропадает. Вам нужно будет установить ширину или максимальную ширину, чтобы масштабирование работало правильно.
#bgwrap{ фон: url(../img/bg1.jpg) без повтора 0px 0px; размер фона: обложка; минимальная ширина: 960 пикселей; максимальная высота: 700 пикселей; [B]максимальная ширина:1260 пикселей;[/B] }
бхакундай 10 апреля 2013 г., 17:40 5
У меня возникла проблема с установкой max-width:1260px; потому что при разрешении 1366 фоновое изображение помещается с одной стороны (слева) при уменьшении масштаба. Я обнаружил, что при использовании нескольких фонов с сокращением «фон» я не мог установить цвет для каждого фона. Есть ли какая-то причина или я ошибаюсь в этом?
ронпат 10 апреля 2013 г., 20:05 6
Разве стенография не прекрасна? Сокращение фона применяет значения по умолчанию для тех, которые не указаны. Фоновый цвет является одним из них. Предполагая, что вы хотите, чтобы за всеми фоновыми изображениями был один и тот же цвет, вы можете либо применить фоновые изображения, используя метод «от руки» (поэтому цвет фона по умолчанию не применяется), ИЛИ применить от руки «цвет фона: # hex» как последний элемент в каскаде «background:», ИЛИ просто примените цвет фона в каждом из сокращений.
бхакундай 11 апреля 2013 г.
No related posts.