HTML Description Lists
Last Updated :
18 Apr, 2024
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.
|
HTML Description Lists Examples
Below are some examples of the description lists in HTML.
Example 1: In this example we demonstrates 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 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:
HTML Description Lists Example Output
Share your thoughts in the comments
Please Login to comment...