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:
12.0
No
49.0
6.0
15.0
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”.
html5 details summaryhtml details openhtml details tag alternativedialog tag in html5html details pdfdetails open tagwebkit-details-markerdetails tag htmlhtml tutorialshtml editorhtml codehtml formhtmltutorialhtml colorhtml color codeshtml tablehtml imghtml5html code for websitehtml and csshtml programshtml websitefree html editorhtml5 tutorialwysiwyg html editorhtml tutorial pdfhtml converterphp tutorialhtml examplehtml tutorialcss tutorialhtml csshtml tagshtml basicscode htmlhtml onlinehtml mailtohtml langhtml tags list
