🏋️ Раздел тренировки
Эти задания помогают не просто выучить слова, а научиться писать HTML без случайных поломок в структуре.
Цель тренировки: уверенно использовать атрибуты и читать вложенность как дерево, а не как случайный набор строк.
Задание 1. Подпишите карточку
Условие: возьмите блок карточки и добавьте к нему class, id и data-step.
Что должно получиться: карточка с понятными атрибутами, пригодная для стилей и логики.
<!-- Исходник без атрибутов — допишите их -->
<section>
<h2>Введение</h2>
<p>Текст карточки.</p>
</section>
Задание 2. Постройте вложенную структуру
Условие: создайте шапку, основной блок и боковую заметку внутри общей страницы.
Что должно получиться: аккуратное дерево из вложенных элементов без лишних div. Целевая структура:
page → header + main → article + aside.Задание 3. Исправьте ошибку в разметке
Условие: найдите и исправьте неправильный порядок вложенности в примере.
<!-- Что здесь не так? -->
<div>
<section>
<p>Текст</div>
</section>
</p>
Что должно получиться: корректная структура, которую легко проверить в DevTools и валидаторе W3C.