HTML HTML Tutorial HTML Forms HTML Graphics HTML Media HTML APIs HTML Tags



HTML Tag: summary

HTML Tag: summary is a new tag introduced in HTML5. It is used to provide a summary or a brief description of the content within a
tag. The
tag is used to create a collapsible section of content on a web page. When the user clicks on the summary, the content within the
tag is revealed or hidden. The tag is used to provide a summary or a brief description of the content within a
tag. It is a required tag within the
tag. The tag should be placed before the content within the
tag. The tag can contain text, images, or other HTML elements. It is important to keep the summary short and concise, as it is meant to provide a quick overview of the content within the
tag.

Example 1: Basic Usage

Here is an example of how to use the <summary> tag:

<details>
  <summary>Click to reveal content</summary>
  <p>This is the content that will be revealed when the summary is clicked.</p>
</details>

In this example, the <details> tag creates a collapsible section of content. The <summary> tag provides a summary of the content within the <details> tag. When the user clicks on the summary, the <p> tag containing the content is revealed.

Example 2: Using Images in the Summary

Here is an example of how to use an image in the <summary> tag:

<details>
  <summary><img src="image.jpg" alt="Image"> Click to reveal image</summary>
  <img src="image.jpg" alt="Image">
</details>

In this example, an image is used in the <summary> tag. When the user clicks on the image, the same image is revealed within the <details> tag.

Example 3: Using HTML Elements in the Summary

Here is an example of how to use HTML elements in the <summary> tag:

<details>
  <summary><h2>Click to reveal heading</h2></summary>
  <p>This is the content that will be revealed when the heading is clicked.</p>
</details>

In this example, an <h2> tag is used in the <summary> tag. When the user clicks on the heading, the <p> tag containing the content is revealed.



Share via:

Activity