HTML: Секция

Основной контент страницы (внутри тега <main>) также может быть размечен с использованием множества различных тегов HTML5. Одним из таких тегов является <section>, позволяющий разметить небольшой участок контента, связанный по смыслу с основным содержанием. Например, мы хотим разметить форму заказа услуги. Такой контент напрямую связан с содержанием нашей страницы, но не может существовать без него. В таком случае его можно разметить с помощью тега <section>.

<header>
    <img src="/logo.png" alt="Логотип"> <!-- Логотип сайта -->
    <nav> <!-- Меню -->
        <ul>
            <li><a href="/">Главная</a></li>
            <li><a href="/about">О нас</a></li>
            <li><a href="/contacts">Контакты</a></li>
        </ul>
    </nav>
</header>

<main>
    <p>Основной контент страницы. Это может быть статья, описание услуги, данные на странице контакты</p>

    <section class="callback-form">
        <h2>Оставить заявку</h2>
        <form>
            <!-- Здесь форма заказа услуги -->
        </form>
    </section>
</main>

Так как <section> является участком связанного между собой контента (раздел статьи, форма связи и т.д.), то зачастую внутри находится заголовок. Данное правило не является обязательным.

Задание

Создайте шапку сайта. Она состоит из 2-х элементов:
* Логотип
* Секция навигации. Внутри неё маркированный список из двух элементов

Добавьте секцию <main>. Внутри создайте две секции с заголовками в теге h2