If a web page needs a list of important words and their definitions then you can use HTML DL tag. To create definition lists two other tags are needed. These are DT for Definition Term and DD for Definition Description. You can create glossary, dictionary or definition lists with these three tags -DL, DT and DD.
Syntax of HTML DL
A definition list in a web page is created by using <DL ></DL> tags. The terms whose definitions have to be listed are mentioned in <DT></DT> tag and their descriptions is given within <DD></DD>. Multiple definition terms can be followed by one description. One definition term can be followed by multiple definitions.
<DL attribute-value pairs>
<DT>Definition term</DT> [<DT>Definition term</DT>] [<DT>Definition term</DT>]
<DD>Description or definition of the term</DD>[<DD>Description or definition of the term</DD>] [<DD>Description or definition of the term</DD>]
</DL>
Features of Definition List
- <DL> is a paired tag. The opening and closing tags are essential to mentioned to create a definition list. All definitions belonging to one definition list can be created with <DT></DT> and <DD></DD> and must be enclosed within a <DL> and </DL>.
- Multiple definition lists can be added in a web page. If you need to manipulate the HTML DL within a script, each ordered list must be given a unique ID.
- All the HTML lists like ordered list and unordered list can be mixed and created pages as per your design need.
- Any number of definitions can be added in a definition list.
- The formatting of the definition list can be done by setting the relevant attributes in <DL> opening tag.
- An individual term and definition can be separately formatted using attributes in individual <DT> and <DD> tags.
Attributes of HTML DL
The definition list has following attributes to be applied to all definitions in the list.
ID
This attribute is used to assign unique identification to a definition list with an alphanumeric string. The ID value should be unique for a web page.
CLASS
This attribute is used to associate definition list with a class defined in a style sheet associated with the page or website.
STYLE
Additional style to a definition list can be added with style attribute. You can set styles in a string form with CSS element and value pairs separated by semicolons.
TITLE
Title attribute creates a tooltip text for a definition list. When the user rests the mouse cursor, value of title attribute appears in a small outlined box telling users something about the definition list.
DIR
DIR is used to set where the term will appear in the HTML DL. Allowed values are LTR for left to right or RTL for right to left.
HTML DT – Definition Term
The definition term has following attributes to be applied to individual definition terms of the definition list.
ID
This attribute is used to assign unique identification to a definition term with an alphanumeric string. The ID value should be unique for a web page.
CLASS
This attribute is used to associate definition term with a class defined in a style sheet associated with the page or website.
STYLE
Additional style to a definition term can be added with style attribute. You can set styles in a string form with CSS element and value pairs separated by semicolons.
TITLE
Title attribute creates a tooltip text for a definition term, which appears when cursor rests on the term.
DIR
DIR is used to set where the definition term will appear in the HTML DT. Allowed values are LTR for left to right or RTL for right to left.
HTML DD – Definition Description
The definition description has following attributes to be applied to individual definition of the definition list.
ID
This attribute is used to assign unique identification to a definition description with an alphanumeric string.
CLASS
This attribute is used to associate definition description with a class defined in a style sheet associated with the page or website.
STYLE
Additional style to a definition description can be added with style attribute. You can set styles in a string form with CSS element and value pairs separated by semicolons.
TITLE
Title attribute creates a tooltip text for a definition description, which appears when cursor is rests on the term description.
DIR
DIR is used to set where the definition description will appear in the HTML DD. Allowed values are LTR for left to right or RTL for right to left.
Example of HTML DL
<TITLE> Welcome to CSVeda.com </TITLE> <HTML> <BODY> <DL> <DT DIR="RTL" STYLE="color:red"> Mouse</DT> <DD>A pointing device to be used with a computer by moving the cursor representing a screen position </DD> <DD>A small animal of rodent family that feeds on food scattered in kitchen and lives in holes</DD> <DT> <U>Monitor</U></DT><DT STYLE="font-weight:bold"> Screen</DT> <DD STYLE="color:blue">Output device that are used to present text, graphics and output to the users</DD> </DL> </BODY> </HTML>