HTML тег <summary>

Элемент <summary> (от англ. "summary" ‒ «резюме, сводка») определяет видимый заголовок для элемента <details>. По заголовку можно нажимать, чтобы просмотреть/скрыть информацию. Элемент <summary> должен идти первым внутри <details>.

Синтаксис

<details>
  <summary> ... </summary>
  ...
</details>

Закрывающий тег

Обязателен.

Атрибуты

Для этого элемента доступны глобальные атрибуты и события.

Стилизация по умолчанию

Большинство браузеров отобразит элемент <summary> со следующими значениями CSS по умолчанию:

summary {
    display: block;
}

Различия между HTML 4.01 и HTML5

Тег <summary> был добавлен в HTML5.

Пример использования:

<details open>  <!-- Для того, чтобы элемент был видимым изначально, следует добавить атрибут open -->
    <summary>Посмотреть код</summary>
    <pre>исчезающая информация</pre>
    <p>исчезающий текст
</details>

Спецификации

Учебник HTML

HTML Элементы