HTML Summary Tag

The HTML <summary> tag is used with <details> tag. It is used as a summary, caption or legend for the content of a <details> element.

It is used within the <details> tag. It must have a closing tag.

The <summary> tag is new and introduced in HTML 5.

HTML summary tag example

<details>  

<summary>JavaTpoint Summary</summary>  

<p> JavaTpoint is a popular tutorial website.</p>  

<p>You can learn various tutorials on JavaTpoint such as HTML, CSS, JavaScript, Java, Android.</p>  

</details>

Output:JavaTpoint Summary

Let’s see another example of HTML summary tag.

<details>    

  <summary>MacBook Pro Specification</summary>    

    <ul>    

      <li><strong>13.3-inch LED-backlit glossy widescreen display</strong> with edge-to-edge, uninterrupted glass (1280 x 800-pixel resolution).</li>    

      <li><strong>2.4 GHz Intel Core i5 dual-core processor</strong> with 3 MB shared L3 cache for excellent multitasking.</li>    

      <li><strong>Intel HD Graphics 3000</strong> with 384 MB of DDR3 SDRAM shared with main memory.</li>    

      <li><strong>500 GB Serial ATA hard drive</strong> (5400 RPM)</li>    

      <li><strong>4 GB installed RAM</strong> (1333 MHz DDR3; supports up to 8 GB)</li>    

    </ul>    

</details>

Output:MacBook Pro Specification

The <summary> tag supports only Global attributes in HTML 5. There are no other specific attributes used with <summary> tag.