HTML <summary> Tag

If this site has been useful, we’d love your support! Running this site takes time and resources, and every small contribution helps us keep creating valuable content. Consider buying us a coffee to keep things going strong!

☕ Buy a Coffee

Description

The <summary> HTML element specifies a summary/caption that can be used in conjunction with the HTML5 <details> tag. This summary/caption can be clicked on to expand/collapse the details as required. Adding CSS to these tags is recommended to show that the summary/caption can be clicked on.

Properties

Permitted Parents: The <details> element
Content: Inline and text
Start/End Tags: Start tag: required, End tag: required

Example

HTML

<details>

  <summary>About CSSPortal</summary>

  <p>CSSPortal is a site dedicated to helping you with CSS.</p>

</details>

Result

Editor

Attributes

None

Global Attributes

The <summary> tag also supports the Global Attributes in HTML5

Event Attributes

The <summary> tag also supports the Event Attributes in HTML5

Browser Support

The following table will show you the current browser support for the HTML <summary> tag.

Desktop

79	12	49	15	6

Tablets / Mobile

18	49	14	6	1	4

Last updated by CSSPortal on: 30th September 2023

Support Us