Тег <hr>: тематический переход
Элемент hr обозначает тематический разрыв между фрагментами, например переход к другой сцене или части рассуждения.
Назначение
Элемент hr обозначает тематический разрыв между фрагментами, например переход к другой сцене или части рассуждения.
Как это работает
Обычно браузер рисует горизонтальную линию. Это пустой элемент, поэтому закрывающий тег не требуется. Цвет, толщину и отступы линии можно задать CSS, сохранив смысл разделения.
Пример
<p>Сначала мы разобрали исходную проблему.</p>
<hr>
<p>На следующий день проверили новый вариант решения.</p>Что должно получиться
Линия соответствует смене эпизода, а не просто добавляет отступ. Если задача только в расстоянии между блоками, её следует решать через CSS.
Граница применения и частая ошибка
Для декоративной границы карточки используйте border, а не дополнительный hr без смыслового перехода. Набор линий не заменяет заголовки и понятную структуру длинной страницы.
Самостоятельная проверка
Разделите два связанных, но самостоятельных эпизода. Затем замените второй эпизод продолжением того же абзаца и оцените, нужен ли тематический разрыв вообще.
HTML и CSS можно изменить в песочнице ниже. Она изолирована: JavaScript, внешние ресурсы и отправка форм отключены. Для проверки сетевых запросов, отправки данных или функций браузера используйте отдельную локальную страницу.