Консультация № 159345
01.02.2009, 16:20
0.00 руб.
0 5 1
Уважаемые эксперты! Как сделать "шапку" сайта со 100% шириной экрана, т.е. Изображение, которое используется в "шапке", как-бы сжимается, при отображении в неполном окне и растягивается, при отображении 100% окна браузера. Может коряво объяснил, но вот, например, сайт http://eterra24.ru, как на этом сайте - верхнее изображение меняется при изменении окна браузера. Как это делается? Если можно, то поподробнее.
Заранее благодарю всех ответивших.
С уважением, Алекс

Обсуждение

Неизвестный
01.02.2009, 17:17
общий
[b]Здесь скорее найдется ответ[/b]
Там зарегистрированы эксперты именно по созданию сайта и хитрости создания...

Это если создаете свой сайт, если же просто отображение страницы, то нажимаете
вписать или подогнать по ширине изображение сжимается.
Неизвестный
01.02.2009, 18:15
общий
Я создаю сайт. Смотрел ответы на вопросы и не нашел ничего подходящего. Мне советовали делать "шапку" с цветом похожим на цвет background и тогда не будет видно при увеличении окна, что картинка статическая, но на некоторых сайтах(я приводил ссылку в вопросе), там именно увеличивается в размере "шапка", потому что ткекст в правой части окна сжимается и разжимается в зависимости от величины окна.
Неизвестный
01.02.2009, 20:47
общий
Приведите шаблон темы, тогда можно будет, что-то сказать, где и что изменить.
Неизвестный
02.02.2009, 16:11
общий
Я думаю Вы(Japa) недопоняли: имеется графический файл высотой, скажем, 90px и шириной 900px, который находится в "шапке" сайта, имеется сайт, страница шириной 900px, сейчас я переделываю сайт и страница будет 100% ширины. Вот и вопрос как сделать, чтобы картинка отображалась на всю ширину монитора
Неизвестный
02.02.2009, 21:56
общий
это ответ
Здравствуйте, Al_hughes!
Картинка фиксированных размеров не будет растягиваться, у меня тоже есть такая проблемка, есть такие варианты:
Отдельно делается фон который можно растягивать на 100%
Например на тестовой странице фон для рисунка задаётся тонкой полоской из трех цветов так

body {
margin: 0;
padding: 0;
font: .70em/1.5em Verdana, Tahoma, Helvetica, sans-serif;
color: $textocolor;
background: #A9BAC3 url(http://3.bp.blogspot.com/_73i0fjAB_Hw/SLoyAXlFFOI/AAAAAAAAAQQ/qsTPlrda3I8/s1600/bg.gif) repeat-x;
text-align: center;
}
Скачайте этот урл и вы её увидите сами
параметр repeat-x задает заполнение по горизонтали, что бы посмотреть эту полоску увеличте размер страницы в браузере (Ctrl +)
Саму экспериментальную страницу можно
посмотреть здесь

На полученном фоне комбинируйте несколько рисунков , которые будут иметь такой же фон как и главный , эти рисунки скорее всего три два по бокам и один по центру
естественно должны иметь свои собственные урлы.
Подберите размеры рисунков так, что бы при просмотре на самом маленьком разрешении они не мешали друг другу.
Думаю, что идея понятна.

Форма ответа