HTML <details> Tag with the 'open' Attribute

<details open>
<p>If your browser supports this element, you will be able to expand and collapse these details.</p>
<p>You can click the summary again to collapse.</p>
</details>

The above example demonstrates how to use the open attribute on the <details> element.

The open attribute allows you to specify whether the details should be open (visible to the user) or closed (hidden from the user).

The open attribute is a boolean attribute. Therefore, if the attribute is present, its value must either be the empty string or a value that is an ASCII case-insensitive match for the attribute's canonical name, with no leading or trailing whitespace (i.e. either open or open="open").

Possible values:

• [Empty string]
• open

About the <details> Element

The <details> element represents additional details that the user can view or hide on demand.

The <details> element can be used along with the summary element in order to provide a legend that can be clicked to expand or collapse further details as required.