open
open attribute
The open attribute in HTML is a Boolean attribute applied to the <details> element to make its content visible by default. When included, the content, often wrapped in a <summary> tag, is shown initially. If the attribute is not present, the content stays hidden until the user interacts with the summary.
Syntax
<details open>
Example
This is a summary
Here are some details that will be visible by default because the open attribute is present.
This is another summary
Here are some details that will be hidden by default because the open attribute is not present.
<details open>
<summary>This is a summary</summary>
<p>Here are some details that will be visible by default because the open attribute is present.</p>
</details>
<details>
<summary>This is another summary</summary>
<p>Here are some details that will be hidden by default because the open attribute is not present.</p>
</details>
Definition and Usage
The open attribute is a boolean attribute.
When included, it indicates that the details should be displayed (open) by default.
Values
The open attribute is a boolean attribute, meaning it doesn't have any values associated with it.
Applies To
The open attribute can be used on the following html elements.
Conclusion
The open attribute in HTML makes the content of a <details> element visible by default when the page loads. If not included, the content stays hidden until the user clicks the <summary> tag. This attribute is helpful for showing collapsible content that should start expanded.