Шапка сайта

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


Что, где подправить? И какого размера надо саму картинку? Спасибо!!!

« Последнее редактирование: 11 Мар 2018 16:07:40 pm от Spido »
*

Spido

  • *
  • 1634

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

Если вам помогли, то не стесняйтесь отблагодарить донатом:

Это вопрос чисто HTML верстки + немного CSS... Если я правильно понял, надо чтобы логотип был слева, телефон - справа, а люди - всегда в центре и что б это смотрелось при любом разрешении - корректно...

Как правильно заметил Spido надо будет верстать в таблицу и использовать при этом свойства CSS, однако достаточно будет 2-х ячеек и умения работать в фотошопе.

А именно:

Кусок кода с html:

<table class="table"><tr><td align="left"><img src="логотип.гиф"></td><td align="right">верстка текста с телефоном и аськой</td></tr></table>

Кусок кода css:
.table {
    background-image: url('фоновой рисунок максимального размера с людьми в центре'); /* Путь к фоновому рисунку */
    background-position: top center; /* Положение фонового рисунка, в данном случае - в центре */
    background-repeat: no-repeat; /* Отменяем повторение фонового рисунка */
}

Как видно из примера в фоне у нас будут люди с лучами, остальное - по ячейкам....

Это вопрос чисто HTML верстки + немного CSS... Если я правильно понял, надо чтобы логотип был слева, телефон - справа, а люди - всегда в центре и что б это смотрелось при любом разрешении - корректно...

Как правильно заметил Spido надо будет верстать в таблицу и использовать при этом свойства CSS, однако достаточно будет 2-х ячеек и умения работать в фотошопе.

А именно:

Кусок кода с html:
<table class="table"><tr><td align="left"><img src="логотип.гиф"></td><td align="right">верстка текста с телефоном и аськой</td></tr></table>

Кусок кода css:
.table {
    background-image: url('фоновой рисунок максимального размера с людьми в центре'); /* Путь к фоновому рисунку */
    background-position: top center; /* Положение фонового рисунка, в данном случае - в центре */
    background-repeat: no-repeat; /* Отменяем повторение фонового рисунка */
}

Как видно из примера в фоне у нас будут люди с лучами, остальное - по ячейкам....

Вот с фотошопом не очень((((( Кто нибудь сможет помочь порезать? И хотелось бы конечно готовые коды куда вставить, если кто поможет могу исходники скинуть!!!