dt tag in html with examples

Home » HTML » HTML Tags » dt tag in html with examples

Posted by 20Fingers2Brains on Tags: HTML , HTML Tags

The <dt> tag is used for specifying a definition term in a definition list.
A definition list is similar to other lists but in a definition list, each list item contains two entries; a term and a description.
The <dt> tag is used in conjunction with <dl> (defines the definition list) and <dd> (describes the item in the list).
The <dt> tag is supported in all major browsers.

Example :

     <html>
     <head>
     <title>DT</title>
     </head>
     <body>
     <dl>
     <dt>Fruits</dt>
     <dd>Mango</dd>
     <dd>Grapes</dd>
     <dt>Vegetables</dt>
     <dd>Potato</dd>
     <dd>Tomato</dd>
     </dl>
     </body>
     </html>

Demo :

In the above example, we have rendered dt tag.

dt and Style :

<html>
<head>
<title>DTStyle</title>
<style type="text/css">
dt
{
font-family:comic sans ms;
color:green;
width:400px;
text-align:center;
}
</style>
</head>
<body>
<dl>
<dt>Fruits</dt>
<dd>Mango</dd>
<dd>Grapes</dd>
<dt>Vegetables</dt>
<dd>Potato</dd>
<dd>Tomato</dd>
</dl>
</body>
</html>

Demo :

In the above example, we have rendered dt element. We have also applied CSS to it.