Easy Tutorial
❮ Canvas Rect Att Th Height ❯

HTML <details> Tag

Example

Using the <details> element:

<details>
<summary>Copyright 1999-2011.</summary>
<p> - by Refsnes Data. All Rights Reserved.</p>
<p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
</details>

Browser Support

Currently, only Chrome and Safari 6 support the <details> tag.


Tag Definition and Usage

The <details> tag specifies additional details that the user can view or hide on demand.

The <details> tag is used to create an interactive widget that the user can open and close. Any sort of content can be put inside the <details> tag.

The content of a <details> element is not visible unless the open attribute is set.


Differences Between HTML 4.01 and HTML5

The <details> tag is new in HTML5.


Tips and Notes

Tip: Use the <summary> tag in conjunction with <details> to specify a visible heading for the details. The heading is visible, and when clicked, it reveals the details.


Attributes

Attribute Value Description
open New open Specifies whether the details should be visible to the user.

Global Attributes

The <details> tag supports HTML's global attributes.


Event Attributes

The <details> tag supports HTML's event attributes.

❮ Canvas Rect Att Th Height ❯