DEV Community

Charity Parks
Charity Parks

Posted on

HTML Lists part 2

This post is part 2 of 2 on HTML Lists. Previously I covered <ol>, <li> and <ul> elements. If you would like to see that blog post:
https://dev.to/charityparks/html-ol-li-and-ul-elements-explained-19dp
Today i'm going to cover <dl>, <dt> and <dd>.

The <dl> element is how you create a 'definition list'. This would typically be muliple terms and their definitions. Inside the <dl> element you will have <dt> and <dd> elements. <dt> stands for 'definition term' and the <dd> stands for the 'definition' itself.

Here is an example of the code followed by the result:

Code:

<dl>
<dt>Twine</dt>
<dd>Light thread</dd>
<dt>Yarn</dt>
<dd>Long continuous length of fibers</dd>
<dt>Rope</dt>
<dd>Multiple strings that are twisted together</dd>
</dl>

Result:

Twine
Light thread
Yarn
Long continuous length of fibers
Rope
Multiple strings that are twisted together

Enjoy and Happy Coding!

Top comments (2)

Collapse
 
thomasbnt profile image
Thomas Bnt ☕

Just a heads up that there’s a built-in way for folks to link up posts in a series. If you’re interested, you can learn more about how to use our series feature here.

More details in our editor guide!

Collapse
 
charityparks profile image
Charity Parks

Hey! Thanks!!!