Horje
HTML Description Lists

HTML Description List <dl> organizes terms and descriptions, utilizing <dt> and <dd> tags within <dl>. This structured format clarifies content presentation, enhancing comprehension and readability for diverse information on web pages.

Syntax

<dl>
    <dt>Course</dt>
    <dd>DSA</dd>
    <dt>Language</dt>
    <dd>Python</dd>
</dl>

Description Lists Tags

Tags

Descriptions

<dl>

This tag defines the description list.

<dt>

This tag defines the data terms inside the list.

<dd>

This tag defines the description of data.

Example 1: In this example, we demonstrate a description list with terms and their descriptions, including HTML, CSS, and JavaScript, providing concise information about each.

HTML 
<!DOCTYPE html>
<html>

<head>
    <title>Description Lists Example</title>
</head>

<body>
    <h2>HTML Description Lists</h2>
    <dl>
        <dt>HTML</dt>
        <dd>
            HyperText Markup Language
        </dd>

        <dt>CSS</dt>
        <dd>
            Cascading Style Sheets
        </dd>

        <dt>JavaScript</dt>
        <dd>
            A high-level, interpreted
            programming language that conforms
            to the ECMAScript specification.

        </dd>
    </dl>
</body>

</html>

Output: 


Html-description-list

HTML Description Lists Example Output


Example 2: In This example we represents a description list with one term (“GeeksforGeeks”) and two descriptions. The second description contains a nested description list with terms (“Courses”) and their corresponding descriptions.

HTML 
<!DOCTYPE html>
<html>

<body>
    <h3>HTML Description Lists</h3>

    <dl>
        <dt>GeeksforGeeks</dt>
        <dd>
            A Computer Science Portal For
            Geeks
        </dd>
        <dd>
            <dl>
                <dt>Courses</dt>
                <dd>Programming</dd>
                <dd>Web Tech</dd>
                <dd>Reasoning</dd>
                <dd>DSA</dd>
            </dl>
        </dd>
    </dl>
</body>

</html>

Output:

HTMLDescriptionList

HTML Description Lists Example Output

HTML Description Lists – FAQs

What is the usevof the <dl> tag?

The <dl> tag defines a description list. It is the container element for terms and their descriptions.

How do I use the <dt> tag?

The <dt> tag is used to specify a term or name in the list. Each <dt> element is a part of the description list and is followed by one or more <dd> elements.

What does the <dd> tag do?

The <dd> tag provides the description or details for the preceding term specified in the <dt> tag. It is used to describe or define the term.

Can description lists be nested?

Yes, description lists can be nested. You can place a <dl> element inside another <dd> element to create hierarchical descriptions.

Can I style description lists with CSS?

Yes, you can style description lists using CSS just like any other HTML element. You can target the <dl>, <dt>, and <dd> elements individually or collectively.


 


Reffered: https://www.geeksforgeeks.org

HTML

Related
How to Set Checkboxes Readonly in HTML ? How to Set Checkboxes Readonly in HTML ?
HTML Vs CMS - Which is Right for Your Website ? HTML Vs CMS - Which is Right for Your Website ?
Getting Started with HTML Coding Getting Started with HTML Coding
How to Get the Content of an HTML Comment using JavaScript ? How to Get the Content of an HTML Comment using JavaScript ?
Can we Create a Nested Form in HTML ? Can we Create a Nested Form in HTML ?

Type:
 Geek
Category:
 Coding
Sub Category:
 Tutorial
Uploaded by:
 Admin
Views:
 12



 

Horje