HTML <details> Tag
Description
The <details> HTML element is used to store information that can be hidden or shown at the request of the user. By default, the contents of the element are not displayed; the open attribute is used to change the status.
Initially, the contents of the <details> are hidden, instead of it the text "Details" is displayed, clicking on which hides or shows the contents of the element.
Properties
- Permitted Parents
- Any element that accepts flow content
- Content
- Block, inline and text
- Start/End Tags
- Start tag: required, End tag: required
Example
<details>
<summary>About CSSPortal</summary>
<p>CSSPortal is a site dedicated to helping you with CSS.</p>
</details>Attributes
| Attribute | Definition |
|---|---|
| open | Specifies whether the details should be open (visible to the user) or closed (hidden from the user). |
Global Attributes
The <details> tag also supports the Global Attributes in HTML5
Event Attributes
The <details> tag also supports the Event Attributes in HTML5
Browser Support
| Desktop | |||||
 |
 |
 |
 |
 |
 |
| X | X | 12 | 49 | 15 | 6 |
| Tablets / Mobile | |||||
 |
|
|
|
|
 |
| Yes | Yes | 49 | 14 | 6.1 | Yes |