Тег <aside>: дополнительное содержимое по теме
Элемент aside обозначает содержание, косвенно связанное с окружающим материалом и отделимое от его основной линии.
Назначение
Элемент aside обозначает содержание, косвенно связанное с окружающим материалом и отделимое от его основной линии.
Как это работает
Это может быть справочная заметка или блок дополнительных ссылок. Расположение справа не делает контейнер aside автоматически; на мобильном экране он может находиться под основной статьёй.
Пример
<section><h2>Размеры блока</h2><p>Ширина зависит от модели коробки.</p><aside aria-labelledby="hint-title"><h3 id="hint-title">На заметку</h3><p>DevTools показывает padding и border отдельно.</p></aside></section>Что должно получиться
Пояснение дополняет тему размеров и имеет собственное название. Элемент не задаёт колонку автоматически: боковое расположение при необходимости настраивается CSS.
Граница применения и частая ошибка
Не выносите обязательное условие задания в aside только ради боковой колонки. Если без фрагмента основной материал непонятен, ему может быть место в основной последовательности.
Самостоятельная проверка
Напишите короткий основной материал и дополнительную справку. Прочитайте основной текст без справки: он должен сохранить смысл, а справка — добавить полезную деталь.
HTML и CSS можно изменить в песочнице ниже. Она изолирована: JavaScript, внешние ресурсы и отправка форм отключены. Для проверки сетевых запросов, отправки данных или функций браузера используйте отдельную локальную страницу.