5. Отредактируйте стиль, который вы создали в шаге 4, добавив фоновое изображение:
#wrapper {
background-color: #FFF:
background-image: url(images/bg_main.jpg);
background-position: top left;
background-repeat: no-repeat;
Эти три строки кода добавляют фоновое изображение в левом верхнем углу
<div>; параметр no-repeat для свойства background-repeat означает, что изображение
Появляется только один раз. Если вы сохраните файл и просмотрите его
В браузере, то увидите изображение руки, которая как бы держит эту страницу.
Очень здорово. Но единственная проблема заключается в том, что текст находится
Слишком высоко вверху и прикрывает изображение. Далее вы разместите
На странице большой заголовок и левую боковую панель.
Глава 8. Добавпение графики на веб-страницы
6. Добавьте еще два стиля к внутренней таблице стилей:
#banner {
margin-top: 48рх:
}
#announcement {
margin-top: 115рх:
Первая строка просто добавляет небольшие отступы, отталкивающие вниз баннер,
Содержащий заголовок, пока он не станет соприкасаться с белой страницей,
А второй стиль передвигает вниз левую боковую панель, чтобы освободить достаточно
Места для изображения с рукой . Страница должна выглядеть так, как
Показано на рис . 8. 15.
ANNOUNCВМI!NТS
• I.ЬtenlpunOci!DrSir
.·...~........-.....................- •
Qu4&1t8"t'l'de.;m~~
• Sв:IQUiвnon~Nmodl~hitun ........... "_"_
