Which tag is used to display additional information when we click to open or close on demand in HTML ?
Last Updated :
10 Feb, 2022
HTML provides many predefined tags which have some specific functionality for the contribution of developing web pages. In this article, we will learn how to show the additional information when the user clicks to open or close on demand in HTML. This can be simply done with the help of the HTML <details> tag in the document.
This tag is used to display the hidden information. It is used to develop a control called ” disclosure widget”. This control can be toggled (opened and closed) to disclose its details. This control is introduced with a triangular button that represents the state of the widget’ whether hidden content is visible or not. The caption is always specified in the HTML <summary> tag.
Syntax:
<details>
<summary>... </summary>
...
</details>
Example: Below HTML code shows the list of browsers when the user clicks on the triangular button.
HTML
<!DOCTYPE html>
< html >
< body >
< h1 style = "color:green" >
GeeksforGeeks
</ h1 >
< h3 >
Summary tag to display the
additional information
</ h3 >
< details >
< summary >Clent Side Browsers</ summary >< br >
< div >
< div > Google Chrome</ div >
< div > Mozilla Firefox</ div >
< div > Apple Safari</ div >
< div > Opera mini</ div >
</ div >
</ details >
</ body >
</ html >
|
Output:
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...