# 11. XHTML List Module

Contents

This section is normative.

As its name suggests, the List Module provides list-oriented elements. Specifically, the List Module supports the following elements and attributes:

Elements | Attributes | Content Model
--- | --- | ---
dl | Common | label?, (( dt | dd)+ | di+)
di | Common | ( dt+, dd*)
dt | Common | (PCDATA | Text)*
dd | Common | (PCDATA | Flow)*
label | Common | (PCDATA | Text)*
nl | Common | label , li+
ol | Common | label?, li+
ul | Common | label?, li+
li | Common, value | (PCDATA | Flow)*

This module also defines the content set List with the content model (dl | nl | ol | ul)+ and adds this set to the Flow content set of the Structural Module.

Implementation: RELAX NG

XHTML offers authors several mechanisms for specifying lists of information. Lists may contain:

- Unordered information.
- Ordered information.
- Navigation information.
- Definitions.

The previous list, for example, is an unordered list, created with the ul element:

Example

    <ul>
    <li>Unordered information. </li>
    <li>Ordered information. </li>
    <li>Navigation information. </li>
    <li>Definitions. </li>
    </ul>

An ordered list, created using the ol element, contains information where order is important, as in a recipe:

1. Mix dry ingredients thoroughly.
2. Pour in wet ingredients.
3. Mix for 10 minutes.
4. Bake for one hour at 300 degrees.

Definition lists, created using the dl element, generally consist of a series of term/definition pairs (although definition lists may have other applications). Thus, when advertising a product, one might use a definition list:

Lower cost
  The new version of this product costs significantly less than the previous one!
Easier to use
  We've changed the product so that it's much easier to use!
Safe for kids
  You can leave your kids alone in a room with this product and they won't get hurt (not a guarantee).

defined in XHTML as:

Example

    <dl>
    <dt>Lower cost</dt>
    <dd>The new version of this product costs significantly less than the
    previous one!</dd>
    <dt>Easier to use</dt>
    <dd>We've changed the product so that it's much easier to
    use!</dd>
    <dt>Safe for kids</dt>
    <dd>You can leave your kids alone in a room with this product and
    they won't get hurt (not a guarantee).</dd>
    </dl>

## 11.1. Definition lists: the dl , di , dt , and dd elements

Attributes

The Common collection
  A collection of other attribute collections, including: Bi-directional, Core, Edit, Embedding, Events, Forms, Hypertext, I18N, Map, and Metainformation.

Definition lists vary only slightly from other types of lists in that list items consist of two parts: a term and a description. The term is given by the dt element. The description is given with a dd element. The term and its definition can be grouped within a di element to help clarify the relationship between a term and its definition(s).

Example

    <dl>
      <di>
        <dt>Dweeb</dt>
        <dd>young excitable person who may mature
          into a <em>Nerd</em> or <em>Geek</em></dd>
      </di>

      <di>
        <dt>Hacker</dt>
        <dd>a clever programmer</dd>
      </di>

      <di>
        <dt>Nerd</dt>
        <dd>technically bright but socially inept person</dd>
      </di>

    </dl>

Here is an example with multiple terms and descriptions:

Example

    <dl>
       <dt>Center</dt>
       <dt>Centre</dt>
       <dd> A point equidistant from all points
                  on the surface of a sphere.</dd>
       <dd> In some field sports, the player who
                  holds the middle position on the field, court,
                  or forward line.</dd>
    </dl>

## 11.2. The nl element

Attributes

The Common collection
  A collection of other attribute collections, including: Bi-directional, Core, Edit, Embedding, Events, Forms, Hypertext, I18N, Map, and Metainformation.

Navigation lists are intended to be used to define lists of selectable items for ordered presentation. These may be presented in a number of ways, for instance as a navigation bar, or as a menu. Note that a navigation list always starts with a label element that defines the label for the list.

Basic navigation list structure

    <nl>
       <label>Contents </label>
       <li href="#introduction">Introduction</li>
       <li>
          <nl>
              <label>Terms</label>
              <li href="#may">May</li>
              <li href="#must">Must</li>
              <li href="#should">Should</li>
          </nl>
       </li>
       <li href="#conformance">Conformance</li>
       <li href="#references">References</li>
       ...
    </nl>

## 11.3. The ol and ul elements

Attributes

The Common collection
  A collection of other attribute collections, including: Bi-directional, Core, Edit, Embedding, Events, Forms, Hypertext, I18N, Map, and Metainformation.

Both types of lists are made up of sequences of list items defined by the li element. The difference is that ol lists represent lists of items that are essentially ordered (such as the steps of a recipe), while ul lists represent lists of items that are essentially unordered (such as shopping lists).

Basic list structure

    <ol>
       <li>Spring</li>
       <li>Summer</li>
       <li>Autumn</li>
       <li>Winter</li>
    </ol>

## 11.4. The li element

Attributes

The Common collection
  A collection of other attribute collections, including: Bi-directional, Core, Edit, Embedding, Events, Forms, Hypertext, I18N, Map, and Metainformation.

value = NUMBER
  This attribute specifies the value to be used when determining the value of the enumerator on a list item within an ol.

The li element defines a list item within an ordered, unordered, or navigation list.

Within a list, each `li` element has an associated number, which is used for numbering list items in ordered lists:

- If the `li` element has a `value` attribute, the associated number is the value of that attribute;
- otherwise, if the `li` element is the first in the list, then the number has the value 1;
- otherwise the number is one higher than the number of the preceding `li` in the same list.

## 11.5. The label element

Attributes

The Common collection
  A collection of other attribute collections, including: Bi-directional, Core, Edit, Embedding, Events, Forms, Hypertext, I18N, Map, and Metainformation.

The label element is used to define a label for a list. The contents of the label element represent the title of a list (or sublist).

## 11.6. Issues

[XHTML2] 11.3. The ol , and ul elements PR #7663
State: Open
Resolution: None
User: None

Notes:
The working group is not in favor or the definition of a "continueFrom" attribute that would allow continuation of list numbering, simply because there is no way to describe the behavior in current styling languages. However, there is a usecase for being able to define groups of list items and label them.... The working group is continuing to discuss this issue. To be *really* fair to the required structure in his use case ... you really want something like this: <ol> <group> <li>.. <li>... <li>... </group> <group> <label>... <li>... <li>... </group> </ol> The use case has two different structures imposed on top of each other A bit like <label for=""> in HTML4

Re: WD-xhtml2-20040722: Some navigation list requirements (IMHO) PR #7867
State: Open
Resolution: None
User: None

Notes: