HTML Encyclopaedia

The dl tag

This tag is used to enclose a "definition" list. The items in such a list are presented in two parts

  1. A title part indicated by a <dt> tag
  2. A detail part indicated by a <dd> tag

Here's an example

Alberta
Capital : Edmonton; Area : 661185 km2; Economy : Petroleum refining, construction, Food processing, Wood products, Mineral extraction, Tourism
Saskatchewan
Capital : Regina; Area : 651900 km2; Economy : Mineral Extraction, Wheat, Barley, Livestock
Manitoba
Capital : Winnipeg; Area : 650087 km2; Economy : Food processing, Mineral extraction, Machinery, Grain, Meat
<dl> lists can, of course, be nested and here's the example above presented with nested lists.
Alberta
Capital
Edmonton
Area
661185 km2
Economy
Petroleum refining, construction, Food processing, Wood products, Mineral extraction, Tourism
Saskatchewan
Capital
Regina
Area
651900 km2
Economy
Mineral Extraction, Wheat, Barley, Livestock
Manitoba
Capital
Winnipeg
Area
650087 km2
Economy
Food processing, Mineral extraction, Machinery, Grain, Meat
And here's the HTML for the example above
<dl>
<dt>Alberta
<dd><dl><dt>Capital<dd>Edmonton<dt>Area<dd>661185 km<sup>2</sup>
<dt>Economy<dd>Petroleum refining, construction,
Food processing, Wood products, Mineral extraction, Tourism
</dl>
<dt>Saskatchewan
<dd><dl><dt>Capital<dd>Regina<dt>Area<dd>651900 km<sup>2</sup><dt>Economy
<dd>Mineral Extraction, Wheat,
Barley, Livestock
</dl>
<dt>Manitoba
<dd><dl><dt>Capital<dd>Winnipeg<dt>Area<dd>650087 km<sup>2</sup><dt>Economy
<dd>Food processing,
Mineral extraction, Machinery, Grain, Meat
</dl>
</dl>

The <dl> tag takes the single attribute compact which, according to the HTML 3.2 standard is a hint to the browser "to render the list in a more compact style". Here's the list above with the "sub" lists for each province shown with the compact attribute.

Alberta
Capital
Edmonton
Area
661185 km2
Economy
Petroleum refining, construction, Food processing, Wood products, Mineral extraction, Tourism
Saskatchewan
Capital
Regina
Area
651900 km2
Economy
Mineral Extraction, Wheat, Barley, Livestock
Manitoba
Capital
Winnipeg
Area
650087 km2
Economy
Food processing, Mineral extraction, Machinery, Grain, Meat

For a further example of <dl> list with the compact attribute, look at the list of browsers in the introductory page of the HTML encyclopaedia.

The HTML 3.2 standard does not include any specifications as to line and paragraph breaks and indentation in the rendering of a <dl> list.

Browsers
All browsers render <dl> lists with extra indentation for the <dd> elements, however the amount of indentation varies greatly. ARA, NN3 and OP2 indented by about 6 characters. Nested <dl> lists were not further indented by ARA. IE3 and MOS3 indented by 2-3 characters. Only ARA and NN honoured the compact attribute. All browsers put paragraph breaks before and after a <dl> list. OP2 also put a paragraph break before a <dt> element.


See also <dd>, <dt>, <ol>, <ul>, and the general information about lists.