Секция

Основной контент страницы (внутри тега 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


Нашли ошибку? Есть что добавить? Пулреквесты приветствуютсяhttps://github.com/hexlet-basics

Упражнение доступно только авторизованным пользователям.

Пожалуйста, авторизуйтесь, это необходимо для отслеживания прогресса выполнения уроков. Если у вас ещё нет учётной записи, то сейчас самое время создать аккаунт.