[previous]   [next]   [table of contents]

10. 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 Minimal Content Model
dl Common ( dt | dd)+
dt Common (PCDATA | Inline)*
dd Common (PCDATA | Flow)*
nl Common name , li+
ol Common li+
ul Common li+
li Common (PCDATA | Flow)*

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

Implementation: DTD

XHTML offers authors several mechanisms for specifying lists of information. All lists must contain one or more list elements. Lists may contain:

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

<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, should contain information where order should be emphasized, 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:

<dl>
<dt><strong>Lower cost</strong></dt>
<dd>The new version of this product costs significantly less than the
previous one!</dd>
<dt><strong>Easier to use</strong></dt>
<dd>We've changed the product so that it's much easier to
use!</dd>
<dt><strong>Safe for kids</strong></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>

Lists may also be nested and different list types may be used together, as in the following example, which is a definition list that contains an unordered list (the ingredients) and an ordered list (the procedure):

The ingredients:
The procedure:
  1. Mix dry ingredients thoroughly.
  2. Pour in wet ingredients.
  3. Mix for 10 minutes.
  4. Bake for one hour at 300 degrees.
Notes:
The recipe may be improved by adding raisins.

The exact presentation of the three list types depends on the user agent. We discourage authors from using lists purely as a means of indenting text. This is a stylistic issue and is properly handled by style sheets.

10.1. Definition lists: the dl, dt, and dd elements

Attributes

The Common collection
A collection of other attribute collections, including: Core, Events, I18N, and Hypertext

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 and is restricted to inline content. The description is given with a dd element that contains block-level content.

Here is an example:

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

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

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

</dl>

Here is an example with multiple terms and descriptions:

<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>

Another application of dl, for example, is for marking up dialogues, with each dt naming a speaker, and each dd containing his or her words.

10.2. The nl element

Attributes

The Common collection
A collection of other attribute collections, including: Core, Events, I18N, and Hypertext

Navigation lists are intended to be used to define collections of selectable items for presentation in a "navigation" menu. A navigation list is required to start with a name element that defines the name for the list.

On visual user agents, the default presentation behavior is as follows:

  1. The contents of the name element are presented.
  2. When the name element's content is selected, the navigation list's li element contents are displayed.
  3. If an li element contains another navigation list, that list's name's contents are displayed.
  4. If an li element has an href attribute, and that element's contents are selected, the link defined by the href attribute is followed.
  5. If the nl element is de-selected, it's contents are removed from the display.

It is possible to change this default behavior through the use of style sheets. The behavior of navigation lists in non-visual user agents is unspecified.

This example illustrates the basic structure of a nested navigation list:

<nl>
   <name>Contents </name>
   <li href="#introduction">Introduction</li>
   <li>
      <nl>
          <name>Terms</name>
          <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>

10.3. The ol, and ul elements

Attributes

The Common collection
A collection of other attribute collections, including: Core, Events, I18N, and Hypertext

Ordered and unordered lists are rendered in an identical manner except that visual user agents number ordered list items. User agents may present those numbers in a variety of ways. Unordered list items are not numbered.

Both types of lists are made up of sequences of list items defined by the li element.

This example illustrates the basic structure of a list.

<ul>
   <li> ... first list item...</li>
   <li> ... second list item...</li>
   ...
</ul>

10.4. The li element

Attributes

The Common collection
A collection of other attribute collections, including: Core, Events, I18N, and Hypertext
accesskey = Character
This attribute assigns an access key to an element. An access key is a single character from the document character set. Note. Authors should consider the input method of the expected reader when specifying an accesskey.

Pressing an access key assigned to an element gives focus to the element. The action that occurs when an element receives focus depends on the element. For example, when a user activates a link defined by the a element, the user agent generally follows the link. When a user activates a radio button, the user agent changes the value of the radio button. When the user activates a text field, it allows input, etc.

In this example, we assign an access key to a link defined by the a element. Typing this access key takes the user to another document, in this case, a table of contents.

<p><a accesskey="C" 
      rel="contents"
      href="http://someplace.com/specification/contents.html">
    Table of Contents</a>
</p>

The invocation of access keys depends on the underlying system. For instance, on machines running MS Windows, one generally has to press the "alt" key in addition to the access key. On Apple systems, one generally has to press the "cmd" key in addition to the access key.

The rendering of access keys depends on the user agent. We recommend that authors include the access key in label text or wherever the access key is to apply. User agents should render the value of an access key in such a way as to emphasize its role and to distinguish it from other characters (e.g., by underlining it).

navindex = Number
This attribute specifies the position of the current element in the navingation order for the current document. This value must be a number between 0 and 32767. User agents must ignore leading zeros.

The navigation order defines the order in which elements will receive focus when navigated by the user via the keyboard. The navigation order may include elements nested within other elements.

Elements that may receive focus should be navigated by user agents according to the following rules:

  1. Those elements that support the navindex attribute and assign a positive value to it are navigated first. Navigation proceeds from the element with the lowest navindex value to the element with the highest value. Values need not be sequential nor must they begin with any particular value. Elements that have identical navindex values should be navigated in the order they appear in the character stream.
  2. Those elements that do not support the navindex attribute or support it and assign it a value of "0" are navigated next. These elements are navigated in the order they appear in the character stream.
  3. Elements that are disabled do not participate in the navigation order.

Tabbing keys. The actual key sequence that causes navigation or element activation depends on the configuration of the user agent (e.g., the "tab" key is used for navigation and the "enter" key is used to activate a selected element).

User agents may also define key sequences to navigate the navigation order in reverse. When the end (or beginning) of the navigation order is reached, user agents may circle back to the beginning (or end).

The li element defines a list item within an ordered, unordered, or navigation list. When the href attribute is defined, the contents of the list item become a selectable link, just as an a element with an href attribute would be.

10.5. The name element

Attributes

The Common collection
A collection of other attribute collections, including: Core, Events, I18N, and Hypertext

The name element is used to define a name for an nl navigation list. The contents of the name element are displayed as the title of a list (or sublist). See nl for more information.

[previous]   [next]   [table of contents]