Читать книгу Шпаргалки для начинающего верстальщика HTML/CSS - Елена Эберт - Страница 5

Создаем каркас сайта
Пишем шапку сайта

Оглавление

Что такое шапка сайта? Это верхняя часть сайта, где размещены логотип компании, контактные данные компании и панель навигации. Рассмотрим ниже два самых распространенных типа шапки сайта.

В HTML шапку сайта оформляют с помощью тега header, это парный тег.

Тег – это специальное зарезервированное слово в языке HTML, его ключевая составляющая. Именно тегом начинается код и им же заканчивается. Внутри тега располагается информация, которая отображается на веб-странице.

Теги могут быть парными и одиночными. Парный тег состоит из открывающего и закрывающего тегов. Открывающий тег изображается с помощью знаков “ <” и ">». У закрывающего тега перед именем стоит слэш “/».

Например, <header> – открывающий тег, </header> – закрывающий.

Как правило, в 99% случаев шапка сайта сделана стандартно, с позиции языка HTML, поэтому нам, новичкам, следует только несколько раз повторить код указанный ниже на реальных примерах, на практике, чтобы понять как данная шапка с позиции HTML устроена и идти по пути обучения верстке далее.

Начинающему верстальщику для того, чтобы лучше запомнить теги и свойства, а также чтобы лучше ориентироваться в своем коде, необходимо писать комментарии, что и как мы делаем. Комментарии в оформляются следующим образом:

<! – Здесь мы пишем комментарий – >

Так как контент сайта расположен по середине, а по бокам у него имеется пространство, можно предположить, что все содержимое сайта помещено в контейнер – это некий блок, в которым расположена вся информация веб-страницы.

<header>

<div class=«container»> // весь контент, вся информация располагается в контейнере

</div>

</header>

Далее верстаем шапку.

Шпаргалки для начинающего верстальщика HTML/CSS

Подняться наверх