Tuesday, August 3, 2010

Definition Lists: the <dl>, <dt>, and <dd> Elements

A Definition List contains one or more terms and their definitions. However, they can be used for any data that consists of a word or phrase and a longer description of it. For example, the names of people in a conversation can be the definition term and the words they speak can be the description. Or the ingredients of a recipe can be the terms and the details of preparation the descriptions.

http://www.w3.org/TR/html401/struct/lists.html has a good description of Definition Lists

General Form of a Definition List

<dl>
<dt>Definition Term</dt>
<dd>Definition Description</dd>

...

</dl>

A definition list consists of the following elements:

The dl Element

This is the parent element of the definition term and definition description elements. Therefore this element can only contain dt and dd elements.

The dt Element

This element contains the term of the definition. It can only contain inline elements

The dd Element

This element contains the definition description. It can have block or inline child elements.

Attributes

Core Attributes

The core attributes can be applied to the dl, dt, and dd elements.

Most web browsers render the definition description indented from the left margin (when the language is English).

There can be more than one dt element (more than one term) with one dd element and vice versa.

Example:
<dl>
<dt>HTML</dt>
<dt>XHTML</dt>
<dd><p>A language that provides a semantic description (meaning) for the content of a document.</p></dd>
</dl>

No comments: