Loading...
HTML <summary> Tag

HTML <summary> Tag

In this tutorial, we will learn about summary tag in HTML with the help of examples.


<summary> Tag

Summary tag <summary> is used to define a visible heading for the <details> tag.

Note : The <summary> tag should be used the first element of the <details> tag.
We can also click the heading of <details> tag made by using <summary> tag to view/hide the details.

Syntax

<summary>..........</summary>

Example

<!DOCTYPE html>
<html>
  <head>
    <title>Summary Tag</title>
  </head>
  <body>
    <details>
      <summary>HTML</summary>
      <p>Hyper Text Markup Language is the markup language which is used to make websites.</p>
    </details>
  </body>
</html>

Output

HTML

Hyper Text Markup Language is the markup language which is used to make websites.


Global Attribute

Summary Tag support all the global attributes of HTML.


Event Attribute

Summary Tag support all the event attributes of HTML.


Next Tutorial

We hope that this tutorial helped you develop better understanding of the concept of <summary> tag in HTML.

Keep Learning : )

In the next tutorial, you'll learn about HTML <sup> Tag.

- Related Topics