Как работает элемент details в HTML5 для создания раскрывающихся списков?

Элемент <details> в HTML5 работает для создания раскрывающихся списков следующим образом: javarush.com

1. Создаёт контейнер для скрытого содержимого. javarush.com Внутри него можно размещать любой HTML-контент. javarush.com
2. Определяет заголовок с помощью элемента <summary>. javarush.com hcdev.ru Он всегда виден и служит элементом управления для раскрытия или сворачивания содержимого блока <details>. javarush.com
3. Когда пользователь щёлкает или касается элемента <summary>, или отпускает клавишу Enter, когда элемент <summary> находится в фокусе, содержимое родительского элемента <details> переключается на видимое. hcdev.ru

Если опустить атрибут open в HTML, то все элементы <details> будут свёрнуты, и при загрузке страницы будут видны только заголовки резюме. hcdev.ru Если включить в HTML атрибут open, то при загрузке страницы <details> будет отображаться развёрнутым, с видимым содержимым. hcdev.ru