Framify

Tag: <dl>

<dl> Syntax

Syntax Diagram for <dl>
Opening Tag Content Closing
Tag
Open Parameter Close
<dl compact > definition list </dl>

Syntax Diagram for <dt>
Opening Tag Content Closing Tag
<dt> defined term </dt>

Syntax Diagram for <dd>
Opening Tag Content Closing Tag
<dd> definition </dd>

<dl> Description

The <dl>. . . </dl> tags delimit an definition list, in which defined terms are indicated by the "defined term" tag <dt>, and definitions are indicated by the "definition" tag <dd>.

If the compact flag is used, the <dt> text and the <dd> text will both start on the same line if the <dt> text is short enough to fit into the alloted margin.

<dl> Examples

This markup: Here is a definition list: <dl> <dt>Etymology <dd>The study of word origins. <dt>Entomology <dd>The study of insects. </dl> . . .causes the following to be displayed:
Here is a definition list:
Etymology
The study of word origins.
Entomology
The study of insects.
This markup: Here is another definition list: <dl compact> <dt>H<sub><small>2</small></sub>O <dd>Water: a colorless, odorless, liquid oxide of hydrogen. <dt>C<sub><small>12</small></sub>H<sub><small>22</small></sub><!-- -->O<sub><small>11</small></sub> <dd>Sucrose: A crystalline disaccharide sugar. </dl> . . .causes the following to be displayed:
Here is another definition list:
H2O
Water: a colorless, odorless, liquid oxide of hydrogen.
C12H22O11
Sucrose: A crystalline disaccharide sugar.
Note in the above example that the linebreak in the chemical formula for sucrose was effectively ignored by the browser because it was contained within a comment. Had the comment tag <!-- ... --> not been there, the line break in the source document would have been translated into a space in the browser-rendered document. Of course, the same effect could have been achieved by putting the entire content of the <dt> tag on one line, but that tends to make the source document less readable, if that is important to you. The comment allows the source document to remain easily readable, while avoiding extraneous spaces in the browser-rendered page.

Last Modified: