Web Diner List Tutorial - Ordered Lists

Ordered lists are numbered lists. Unordered lists have a bullet before each list item, Ordered lists have a number (or letter) before each list item.

Creating Ordered Lists

All list tags would appear on a web page between the <BODY> and </BODY> tags. The tag to begin an Ordered List is <OL>. Each item in the list will need to have a <LI> or List Item tag before it. The list is closed using the </OL> tag.

Numbered Lists

So, for example, this list:

Three things I know about dining out while traveling on the road:

  1. Never eat at a place called "Mom's"
  2. If the Diner is empty, there's probably a reason
  3. "Chef's Surprise" is usually a surprise, and never, ever, a good risk.
The HTML for this list looks like this: Three things I know about dining out while traveling on the road:
<OL>
<LI>Never eat at a place called "Mom's"
<LI>If the Diner is empty, there's probably a reason
<LI>"Chef's Surprise" is usually a surprise, and never, ever, a good risk.
</OL>

Using Roman Numerals

The default for Ordered Lists is to use numbers. You can change the numbers to Roman numerals by changing the <OL> tag to <OL TYPE=I>. The list would then look like this:
  1. Never eat at a place called "Mom's"
  2. If the Diner is empty, there's probably a reason
  3. "Chef's Surprise" is usually a surprise, and never, ever, a good risk.
To use small Roman numerals, the opening tag would be <OL TYPE=i>. Note that this is one of the few times that the HTML tags are case-sensitive. Our list would then appear:
  1. Never eat at a place called "Mom's"
  2. If the Diner is empty, there's probably a reason
  3. "Chef's Surprise" is usually a surprise, and never, ever, a good risk.

Lettered Lists

The default for Ordered Lists is to use numbers. You can change the numbers to uppercase letters by changing the <OL> tag to <OL TYPE=A>. The list would then look like this:
  1. Never eat at a place called "Mom's"
  2. If the Diner is empty, there's probably a reason
  3. "Chef's Surprise" is usually a surprise, and never, ever, a good risk.
To use small (lower case) letters, the opening tag would be <OL TYPE=a>. Note that this is one of the few times that the HTML tags are case-sensitive. Our list would then appear:
  1. Never eat at a place called "Mom's"
  2. If the Diner is empty, there's probably a reason
  3. "Chef's Surprise" is usually a surprise, and never, ever, a good risk.

Starting An Ordered List at Someplace Other than 1

Sometimes you may want to start a list someplace other than 1 (or I, or i, or A, or a). The first HTML tag of the ordered list would then appear as shown in these examples:
To start a numbered list at 4:<OL START=4>
To start a Roman numeral list at 4: <OL START=4 TYPE=I>
To start a lettered list at the letter D: <OL START=D TYPE=A>

Web Diner Tutorials | Home | List Tutorial

Create Your Own Web Adventure with the Web Diner!

All information copyright Web Diner Inc., 1997. Do not redistribute or repost this content.