HTML - Tutorial 5

HTML Tutorial 5

Prepared by: Anthony Larrain

Ordered Lists

Use an ordered list when the order of the list items need to be emphasized
To create an ordered list use the <ol> tag in place of the <ul>.

Example 1

<ol> <li>Put key in lock.</li> <li>Turn key.</li> <li>Open door.</li> <li>Close door</li> </ol>

Browser Display

Put key in lock.
Turn key.
Open door.
Close door

The numbering can be changed to an alpha character using the type attribute

A

Example 2

<ol type="A"> <li>Put key in lock.</li> <li>Turn key.</li> <li>Open door.</li> <li>Close door</li> </ol>

Browser Display

Put key in lock.
Turn key.
Open door.
Close door

The numbering can be changed to a Roman numeral using the type attribute with value I

Example 2

<ol type="I"> <li>Put key in lock.</li> <li>Turn key.</li> <li>Open door.</li> <li>Close door</li> </ol>

Browser Display

Put key in lock.
Turn key.
Open door.
Close door

The values A and I can be changed to a and i.
Can also use the start attribute to start the sequence with a different number.

Example 3

<ol type="A" start="23"> <li>Put key in lock.</li> <li>Turn key.</li> <li>Open door.</li> <li>Close door</li> </ol>

Browser Display

Put key in lock.
Turn key.
Open door.
Close door

The type and start attributes are deprecated.
A language feature becomes deprecated when it is outdated.
CSS can be used to change the style of the list items.

Design Tip

Use lists to emphasize important points.
Each list item should be short and to the point.
List items are easy to read.

@Anthony Larrain 2005 - 2006

Send Questions or Comments to hci201@yahoo.com