Теги html. 1 Структура документа


1. Структура

header - первый элемент на странице сайта и содержыт название сайта, логотипы, ссылки.

<header></header>

Пример:

<header>
    <a href="/"><img src=logo.png alt="Home"></a>
    <hgroup>
        <h1>It's my blog</h1>
    </hgroup>
</header>

nav - для создания панели навигации.

<nav></nav>

Пример:

<nav>
    <h2>Main navigation</h2>
    <ul>
        <li><a href="/about">About me</a></li>
        <li><a href="/news">News</a></li>
    </ul>
</nav>

Пример обьединения nav и других элементов:

<aside>
    <nav>
        <h2>Main navigation</h2>
        <ul>
            <li><a href="/about">About me</a></li>
            <li><a href="/news">News</a></li>
        </ul>
    </nav>
    <nav>
        <h2>Main news</h2>
        <ul>
            <li><a href="/City">City</a></li>
            <li><a href="/people">People</a></li>
        </ul>
    </nav>
    <section>
        <h2>Section</h2>
        <a href="/web">Web hosting</a>
        <img src="image.png">
        <p> Powered by < a href="/me"> Me </a></p>
    </section>

footer - Используется для создание корневого елемента, сведения о соответствующем разделе.

<footer></footer>

Пример:

<nav>
...
</nav>
<footer>
    <small>Copyright &copy; devops.kiev.ua 2016</small>
</footer>

ARTICLE

article - создает самодостаточные элемент страницы.

<article></article>

Пример:

<article>
    <h2>Hello</h2>
    <p>It's me</p>
</article>