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
Explorer Edge Chrome Firefox Opera Safari
XX1249156
Tablets / Mobile
Android Chrome Firefox Opera Safari Samsung
YesYes49146.1Yes

Last updated by CSSPortal on: 6th December 2019