Open In App
Related Articles

How to add description list of an element using HTML ?

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Report issue
Report
To define the description of an element, the <dl> tag is used. This tag is used with <dt> and <dd> tag. In HTML4.1, it defines the definition list and in HTML5, it defines the description list. Syntax:
<dl> Contents... </dl>
Example 1:
<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to add description list
        of an element using HTML?
    </title>
  
    <style>
        h1,
        h2 {
            text-align: center;
        }
  
        h1 {
            color: green;
        }
  
        dl {
            margin-left: 20%;
        }
    </style>
</head>
  
<body>
    <h1>GeeksforGeeks</h1>
  
    <h2>
        How to define a description/value
        of a term in a description list
    </h2>
  
    <dl>
        <dt>GeeksforGeeks</dt>
        <dd>A Computer Science Portal For Geeks</dd>
    </dl>
      
    <dl>
        <dt>C++</dt>
        <dd>A Object oriented language.</dd>
        <dt>JavaScript</dt>
        <dd>A client side scripting language.</dd>
    </dl>
</body>
  
</html>

                    
Output: Example 2:
<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to add description list
        of an element using HTML?
    </title>
  
    <style>
        h1 {
            color: green;
        }
  
        h1,
        h2 {
            text-align: center;
        }
  
        body {
            width: 70%;
        }
  
        dt {
            color: red;
        }
  
        dd {
            display: inline;
            margin-left: 60px;
        }
    </style>
</head>
  
<body>
    <h1>GeeksforGeeks</h1>
    <center>
        <h4>
            How to define a description/value
            of a term in a description list
        </h4>
    </center>
  
    <dl>
        <dt>Geeks Classes</dt>
        <dd>
            It is an extensive classroom programme
            for enhancing DS and Algo concepts.
        </dd>
        <br />
  
        <dt>Fork Python</dt>
        <dd>
            It is a course designed for 
            beginners in python.
        </dd>
  
        <br />
        <dt>Interview Preparation</dt>
        <dd>
            It is a course designed for 
            preparation of interviews in 
            top product based companies.
        </dd>
    </dl>
</body>
  
</html>

                    
Output: Supported Browsers:
  • Google Chrome
  • Internet Explorer
  • Firefox
  • Opera
  • Safari


Last Updated : 30 May, 2020
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads