The <details> component speaks to a revelation gadget from which the client can get extra data or controls.

<details> .... </details>

Basically, we can utilize details to make an accordion-like gadget that the client can flip open and shut. Inside <details>, we can put any kind of data we need.

There are two pertinent components here: <details> and, alternatively, <summary>. <details> is the wrapper for all the substance we need to show and cover up, and <summary> holds the — well, the <summary> and title of the segment. Actually we needn't bother with the <summary>. In the event that nonattendant, the program will utilize some default content.

The substance of a <details> component ought not be obvious unless the open characteristic is situated.

Here is the Syntax of DETAILS Element

Supported Browser
html5 tutorial html5 tutorial html5 tutorial html5 tutorial html5 tutorial

    Some contents goes here

Below is complete syntax along with example

<!DOCTYPE html>

    	 <title>Title name will go here</title>
    		This is the default content.
            <p>This is the main content, which will be shown.</p>