Learn html - html tutorial - Details tag - html examples - html programs
<details> element is used for adding the additional information of the content . It will be hide or view depending on the user request.
<details> tag is used to create communicating widget for user interaction.
The content of a <details> element cannot be visible unless the open attribute is set.
<details> tag will support Global and event attributes .
<details> tag belongs to Flow content, Sectioning content, Interactive content and Palpable Content category .
Syntax for <details> tag:
<details> content</details>
Differences between HTML 4.01 and HTML 5 for <details> tag in HTML:
HTML 4.0.1
HTML 4 does not support <details> element.
HTML 5
HTML 5 support <details> element.
Sample Coding for <details> tag:
Tryit<!DOCTYPE html>
<html >
<head>
<title> Wikitechy HTML details Tag</title>
</head>
<body>
<details>
<summary> Wikitechy</summary>
<p> Tutorials</p>
<p> Articles</p>
<p> Errors and Fixes</p>
<p> Interview tips</p>
</details>
</body>
</html>
Code Explanation for <details> tag:
<details> tag is mentioned for the additional information to the user they can view or hide.
The <summary> tag specifies a visible heading (Wikitechy) , which should be clicked to view or hide the details.
Output for <details> tag:
When the page loads, the content of the text (Wikitechy) has been hided.
The output shows the details of the text (Wikitechy) .
Attribute of <details> tag:
Attribute
Value
HTML4
HTML5
Description
open
open
No
Yes
Defines that the details should be visible to the user.
Browser Support for <details> tag in HTML:
Tips and Notes
The <summary> tag is used to define a visible heading for the details. The heading can be clicked to view or hide the details.
If the <summary> tag did not present, then the <details> tag automatically displays the heading as “Details”.
Related Searches to details tag in html
html5 details summary
html details open
html details tag alternative
dialog tag in html5
html details pdf
details open tag
webkit-details-marker
details tag html
html tutorials html editor html code html form html tutorial html color html color codes html table html img html5 html code for website html and css html programs html website free html editor html5 tutorial wysiwyg html editor html tutorial pdf html converter php tutorial html example html tutorial css tutorial html css html tags html basics code html html online html mailto html lang html tags list