HTML Definition List
By Stephen Bucaro
One of the most common structures found on a webpage is a list. A list can be used to
organize and clarify information. There are three kinds of lists; the ordered list,
which in which every item is preceded by a number or letter, the unordered list
which is commonly known as the bulleted list, and the definition list which has
two parts for each item, the term and the definition.
The definition list is defined by the <dl> </dl> tag pair.
The definition list is used to display a list of terms and descriptions or
definitions of each term. In a definition list, the terms are defined by <dt>
</dt> tag pairs and the related definitions are defined by <dd> </dd>
tag pairs. The definitions are automatically indented by the browser.
Shown below is code for a definition list:
<dl>
<dt>Term 1</dt>
<dd>Definition for term 1</dd>
<dt>Term 2</dt>
<dd>Definition for term 2</dd>
<dt>Term 3</dt>
<dd>Definition for term 3</dd>
</dl>
- Term 1
- Definition for term 1
- Term 2
- Definition for term 2
- Term 3
- Definition for term 3
A Definition List Can Have Multiple Terms for Single Definition
Shown below, a definition list with multiple terms is used to define some synonyms.
- Division
- Part
- Section
- One of the portions into which something is divided
- Amaze
- Astonish
- Astound
- To surprise or affect with great wonder
<dl>
<dt>Division</dt>
<dt>Part</dt>
<dt>Section</dt>
<dd>One of the portions into which something is divided</dd>
<dt>amaze</dt>
<dt>astonish</dt>
<dt>astound</dt>
<dd>To surprise or affect with great wonder</dd>
</dl>
A Definition List Can Have Multiple Definitions for Single Term
Shown below, is a definition list with multiple definitions for each term.
- Center
- To position in the middle
- Political view between right and left
- Equal distance from circumference
- Even
- Flat
- Smooth
- Uniform
<dl>
<dt>Center</dt>
<dd>To position in the middle</dd>
<dd>Political view between right and left</dd>
<dd>Equal distance from circumference</dd>
<dt>Even</dt>
<dd>Flat</dd>
<dd>Smooth</dd>
<dd>Uniform</dd>
</dl>
|