Trusted answers to developer questions
Trusted Answers to Developer Questions

Related Tags

html

What is the summary element in HTML?

Abdul Monum

Grokking Modern System Design Interview for Engineers & Managers

Ace your System Design Interview and take your career to the next level. Learn to handle the design of applications like Netflix, Quora, Facebook, Uber, and many more in a 45-min interview. Learn the RESHADED framework for architecting web-scale applications by determining requirements, constraints, and assumptions before diving into a step-by-step design process.

The <summary> element in HTML is used to specify a visible heading, summary, caption, or legend for the <details> element’s interactive box. Users click on the visible text wrapped by the <summary> element, which can open or close the box that contains the markup of the children elements of the <details> element. The <summary> element can contain plain text, heading elements, or any HTML element that can be specified inside the <p> (paragraph) element.

The <summary> element and <details> element are used in conjunction. However, the restriction is that the <summary> element must be the first child of the <details> element. If the <summary> element is not specified as the first <details>, then the default label “Details” is used for the box.

Example

Explanation

The above code wraps a simple text “Summary Element in HTML” inside the <summary> element, which is the first child of the <details> element. You can view/hide the paragraph content inside the <p> element by clicking on the text, “Summary Element in HTML”.

RELATED TAGS

html

CONTRIBUTOR

Abdul Monum
Copyright ©2022 Educative, Inc. All rights reserved

Grokking Modern System Design Interview for Engineers & Managers

Ace your System Design Interview and take your career to the next level. Learn to handle the design of applications like Netflix, Quora, Facebook, Uber, and many more in a 45-min interview. Learn the RESHADED framework for architecting web-scale applications by determining requirements, constraints, and assumptions before diving into a step-by-step design process.

Keep Exploring