HTML-тег <details>

Тег <details> представляет собой элемент управления, из которого пользователь может получить дополнительную информацию по запросу.

Его можно использовать для создания интерактивного виджета, который пользователь может показать или скрыть (например, expand или collapse) для получения дополнительной информации или элементов управления. Внутри элемента details могут быть использовать любые теги.

Тип:	Block
Контент:	Блочные, строчные элементы, текст
Открывающий тег:	Обязательный
Закрывающий тег:	Обязательный
Версия:	Новый в HTML5

Синтаксис

Базовый синтаксис тега <details> выглядит следующим образом:

HTML / XHTML: <details>  ... </details>

Примеры написания кода тега <details> :

<details>
    <summary>Что такое HTML?</summary>
    <p>HTML является языком разметки для описания структуры веб-страниц.</p>
</details>

Вы можете (и должны) указывать альтернативный контент внутри элемента <details>. Этот контент будет отображаться как в старых браузерах, которые не поддерживают тег <details>, так и в браузерах с отключенным JavaScript.

Специальные атрибуты тега

В следующей таблице приведены атрибуты, которые относятся к тегу <details>:

Атрибут	Значение	Описание
`open`	open	Этот логический атрибут указывает, будут ли детали видны пользователю при загрузке страницы. Значение по умолчанию — false, поэтому детали будут скрыты.