smolalit
7 лет назадСоздание сайта - 3: Верстка html ("шапка")
Шаг 3 – Верстка
3.3 – Строим из блоков
В результате предыдущих шагов мы уже получили страничку, которую можно открыть в браузере.
Каркас сайта мы будем строить в файле index.html, а внешний вид будем задавать в файле style.css.
Блок 1
Мы уже создали основной блок и назвали его glav. Определим его внешний вид (как и договорились, в файле style.css):
Эта строка задает ширину блока (970px) и позиционирование (по центру).
Блок 2
Блок – «шапка» (назовем его header). Создаем его в файле index.html:
Определим его вид:
Задаем: высоту блока, фон, рисунок, положение рисунка и отменяем повтор изображения.
В блоке «шапки» у меня также будет располагаться меню. Создаем для него блок mn и само меню:
Определим внешний вид меню:
В строке 5 стили для блока: расположение по правой стороне и ширина.
В строке 6 стили для меню: отменяем маркер перед пунктами меню и задаем отступ сверху в 15 пикселей.
В строке 7 стили для каждого пункта меню: отступ между пунктами.
В строке 8 стили для ссылок меню: размер шрифта, шрифт, цвет и отмена подчеркивания ссылок.
В строке 9 стили для активной ссылки: размер шрифта, шрифт, цвет и отмена подчеркивания ссылок. При наведении указателя мыши, цвет ссылки будет изменяться.
Вот наша «шапка» и готова! Если открыть страничку в браузере, увидим следующее:
Посты рубрики:
Создание сайта - 2: Верстка html
Создаю свой сайт, публикую описание и приглашаю попутчиков
