Web

HTML List Tags and Parameters

Ordered Lists (or Numbered Lists)

Example Generating Code
List
  1. Item 1
  2. item 2
  3. Item 3
  4. Item 4
List
<ol>
<li>Item 1
<li>Item 2
<li>Item 3
<li>Item 4
</ol>

Ordered List Parameters

The Start parameter

Example Generating Code
  1. Item 5
  2. item 6
  3. Item 7
  4. Item 8
<ol start=5>
<li>Item 5
<li>Item 6
<li>Item 7
<li>Item 8
</ol>

The start parameter overrides the normal setting to allow you to have a list with a break in it or to start a list at a point higher than 1.

Type parameter

The possible numbering systems are
Value Style Example
1 Arabic 1,2,3...
A Uppercase Alpha A,B,C...
a Lowercase Alpha a,b,c...
I Uppercase Roman I,II,III...
i Lowercase Roman i,ii,iii...

Example List Generating Code
  1. Item
  2. item
<ol type=1>
<li>Item
<li>Item
</ol>
  1. Item
  2. Item
<ol type=A>
<li>Item
<li>Item
</ol>
  1. Item
  2. Item
<ol type=a>
<li>Item
<li>Item
</ol>
  1. Item
  2. Item
<ol type=I>
<li>Item
<li>Item
</ol>
  1. Item
  2. Item
<ol type=i>
<li>Item
<li>Item
</ol>

Nesting Lists

Example Generating Code
  1. First Category
    1. First Sub-Category
      1. Item
      2. Item
    2. Second Sub-Category
    3. Third Sub-Category
    4. Fourth Sub-Category
  2. Second Category
  3. Third Category
  4. Fourth Category
<ol type=A>
<li>First Category
<ol type=1>
<li>First Sub-Category
<ol type=a>
<li>Item
<li>Item
</ol>
<li>Second Sub-Category
<li>Third Sub-Category
<li>Fourth Sub-Category
</ol>
<li>Second Category
<li>Third Category
<li>Fourth Category
</ol>

Unordered Lists

Example Generating Code
  • Item 1
  • item 2
  • Item 3
  • Item 4
<ul>
<li>Item 1
<li>Item 2
<li>Item 3
<li>Item 4
</ul>

Unordered List Type Parameter

Example Bullet Type Generating Code
  • Item
  • Item
Circle <ol type=circle>
<li>Item
<li>Item
</ol>
  • Item
  • Item
Square <ol type=square>
<li>Item
<li>Item
</ol>
  • Item
  • Item
Disc <ol type=disc>
<li>Item
<li>item
</ol>

Definition List

Example Generating Code
Term 1
Definition 1
Term 2
Definition 2
Term 3
Definition 3
Term 4
Definition 4
<dl>
<dt>Term 1<dd>Definition 1
<dt>Term 2<dd>Definition 2
<dt>Term 3<dd>Definition 3
<dt>Term 4<dd>Definition 4
</dl>

Emphasis

Ordered, Unordered and Definition lists can all have emhasis applied to the list items.
Just mark the text to be emphasised just like you would if it was not in a list.
Lists with Emphasis
Example Generating Code
Term 1
Definition 1
Term 2
Definition 2
Term 3
Definition 3
Term 4
Definition 4
<dl>
<dt><b>Term 1</b><dd><i>Definition 1</i>
<dt><b>Term 2</b><dd><i>Definition 2</i>
<dt><b>Term 3</b><dd><i>Definition 3</i>
<dt><b>Term 4</b><dd><i>Definition 4</i>
</dl>
  1. Item 1
  2. Item 2
  3. Item 3
  4. Item 4
<ol>
<li><b>Item 1</b>
<li><b>Item 2</b>
<li><b>Item 3</b>
<li><b>Item 4</b>
</ol>
  • Item 1
  • Item 2
  • Item 3
  • Item 4
<ul>
<li><u>Item 1</u>
<li><u>Item 2</u>
<li><u>Item 3</u>
<li><u>Item 4</u>
</ul>
Last Page Update January 25, 2001
Pen Pic This page is maintained by Troy S. Cash, a computer Instructor at NWACC. If you have any Suggestions, Complaints, Comments about this page then you can e-mail him by clicking on the pen and paper. Valid HTML 4.0!
The Background Graphic on this page is the exclusive property of NorthWest Arkansas Community College.
It was constructed by the Compressed Video Facilitator Clint Brooks, mailto:brooks@nwacc.cc.ar.us