Базовый синтаксис
У HTML-элемента может быть набор атрибутов. Главное правило - писать их явно, в кавычках и без дублирования смысла.
Файл: subjects/html-css/course/lessons/04-tags-attributes-nesting/commands.html
<!-- Общая форма HTML-элемента -->
<div class="card" id="intro" data-step="1">Содержимое</div>Популярные атрибуты
| Атрибут | Зачем нужен | Пример |
|---|---|---|
class | Группа элементов с общим стилем | class="button button-primary" |
id | Уникальная точка на странице | id="hero" |
data-* | Собственные данные для элемента | data-role="menu" |
lang | Язык документа или части документа | lang="ru" |
Что помнить о вложенности
| Ситуация | Правильно | Комментарий |
|---|---|---|
| Вложенный блок | Сначала внутренний, потом внешний | Порядок закрытия должен совпадать с порядком открытия |
| Список внутри карточки | card → h3 → ul | Структура читается без подсказок |
| Кнопка с данными | button data-action="close" | Удобно для логики и тестов |
Как читать этот справочник
Если элемент повторяется, используйте class. Если он уникален, чаще подходит id. Если нужно прикрепить служебную метку, используйте data-*. А если сомневаетесь в структуре, смотрите на вложенность и порядок закрытия тегов.