Open In App

HTML | <details> open Attribute

Last Updated : 21 Jul, 2022
Comments
Improve
Suggest changes
Like Article
Like
Report

The HTML <details> open attribute is used to indicate whether the details will be display on page load. It is a boolean attribute. If this attribute is present then the detail will be visible. 

Syntax:

<details open> Contents... </details>

Example: This example illustrates the use of open attribute in <details> element. 

html
<!-- HTML program to illustrate details open Attribute -->

<!DOCTYPE html> 
<html> 
    <head> 
        <title>HTML details open Attribute</title> 
    </head> 
    
    <body> 
        <h1 style="text-align:center;">
            GeeksForGeeks
        </h1>
        
        <h2 style = "color: green; text-align: center;"> 
            HTML &lt;Details&gt;open Attribute 
        </h2> 
        
        <!-- Below details tag has "open" attribute -->
        <details open> 
            <summary>Geeks classes</summary> 
            
            <p> 
                An extensive classroom programme to build 
                and enhance Data Structures and Algorithm 
                concepts. 
            </p> 
        </details> 
    </body> 
</html>                    

Output:

  

Supported Browsers: The browser supported by HTML <details> open attribute are listed below:

  • Google Chrome 12.0
  • Edge 79.0
  • Firefox 49.0
  • Safari 6.0
  • Opera 15.0

Similar Reads