Тег <details>

<details> создаёт виджет, который раскрывается/сворачивается по клику, без единого JavaScript. Заголовок задаётся через summary.

Syntax

<details>
  <summary>Заголовок</summary>
  Содержимое
</details>

Attributes

open Если присутствует, содержимое показано развёрнутым сразу при загрузке.

Example

<details open>
  <summary>Что входит в тариф?</summary>
  <p>Неограниченное количество инструментов.</p>
</details>

Notes

  • Без summary браузер показывает стандартный текст-заглушку вместо заголовка.

Accessibility

  • details/summary доступны с клавиатуры и озвучиваются скринридерами нативно, без дополнительной ARIA-разметки.

Похожие инструменты