Intro HTML Fonts HTML Backgrounds HTML Lists HTML Layout HTML Tables Graphics FTP

Ordered and Unordered Lists are a way in which the Web Designer can organize data on a page.

Ordered Lists (numbered lists)<OL> Starts each ordered list<LI> Starts each item in the list
Example
<OL>
<LI>The first item in my list
<LI>The second item in my list
</OL>

Which would look like this in your HTML document.
  1. The first item in my list
  2. The second item in my list

Ordered Lists (numbered lists) Default numbering scheme, which is shown as: 1,2,3
Additional Types:
<OL Type =A> scheme is: A, B, C
<OL Type =a> scheme is: a, b, c
<OL Type=I> scheme is: I, II, III
<OL Type=i> scheme is: i, ii, iii

Example
Ordered List Type I Ordered List Type i
  1. This is the first item in my list
  2. This is the second item in my list
  3. This is the third item in my list
  4. This is the fourth item in my list
  1. This is the first item in my list
  2. This is the second item in my list
  3. This is the third item in my list
  4. This is the fourth item in my list
Ordered List Type A Ordered List Type a
  1. This is the first item in my list
  2. This is the second item in my list
  3. This is the third item in my list
  4. This is the fourth item in my list
  1. This is the firs item in my list
  2. This is the second item in my list
  3. This is the third item in my list
  4. This is the fourth item in my list

Unordered Lists (bulleted lists)

<UL Type=disc> <UL Type=circle> <UL Type=square>
  • first item
  • second item
  • third item
  • fourth item
  • first item
  • second item
  • third item
  • fourth item
  • first item
  • second item
  • third item
  • fourth item

There can be more than one list within a list

Example


<OL Type=I>
<LI>Things to do
<UL Type=square>
<LI>First thing
<LI>Second thing
</UL>
<LI>Additional things
</OL>

Which looks like this in an HTML document:

  1. Things to do
    • First thing
    • Second thing
  2. Additional things

Some Web Page creators use small icons called Bullets to achieve a list effect without actually creating an Unordered List.

The Bullets are placed within the <IMG SRC="name_of_gif">tag

<IMG SRC="gifs/blueball.gif"> This is an item <BR>
<IMG SRC="gifs/blueball.gif"> This is an item <BR>
<IMG SRC="gifs/blueball.gif"> This is an item <BR>
<IMG SRC="gifs/blueball.gif"> This is an item <BR>

This is an item
This is an item
This is an item
This is an item

Web Building tutorials: Intro | Fonts | Backgrounds | Lists | Layout | Tables | Graphics | FTP

© 2005 Interactive Mystery Productions Ltd.
A Company Limited by Guarantee
Registered in England & Wales No. 4792272
All Rights Reserved