|GETTING STARTED |HTML |GRAPHICS |ADD-ONS |FINAL TOUCHES |HELP |GEOHELP |HOME|

title image [2,233 bytes]

|ESCAPE CHARACTERS |FONTS |FORMS |FRAMES |HTML EDITORS |LINKING |LISTS |TABLES |TAGS
BASIC STRUCTURE

UNORDERED LISTS - ORDERED LISTS - DEFINITION LISTS

bar gif [1,869 bytes]

Using a 'List' is another great way to align your text.
Below I have listed 3 types that can be used to give the various effects.

UNORDERED LISTS

Also referred to as a 'bullet list', the 'unordered list' will begin with the <UL> (unordered list) tag to start the list.
This will then be followed by the <LI> (list) tag to specify the information.
Then we need to close it with the </UL> tag.

EXAMPLE:

This is an Unordered List
<UL>
<LI>This is my first line.
<LI>This is my second line.
<LI>This is my third line.
</UL>
This is an Unordered List
  • This is my first line
  • This is my second line
  • This is my third line

You can also change shape of the 'bullet' by using the TYPE commands in the tags: The three shapes can be: Disc, Circle or Square.
To have the whole list one shape, add it to the <UL> tag, to change the shape individually, add it to the <LI> tag.

EXAMPLE:

This is an Unordered List using "Square"
<UL TYPE="square">
<LI>This is my first line.
<LI>This is my second line.
<LI>This is my third line.
</UL>
This is an Unordered List using "Square"
  • This is my first line
  • This is my second line
  • This is my third line
This is an Unordered Individual Shape List
<UL>
<LI TYPE="square">This is my first line.
<LI TYPE="circle">This is my second line.
<LI TYPE="disc">This is my third line.
</UL>
This is an Unordered Individual Shape List
  • This is my first line
  • This is my second line
  • This is my third line

back to top

bar gif [1,869 bytes]

- ORDERED LIST -

These lists are displayed as a numbered list (this is the default). It begins with the <OL> tag, then use the <LI> tag and close it with the </OL> tag.

EXAMPLE:

This is an Ordered List
<OL>
<LI>This is my first line.
<LI>This is my second line.
<LI>This is my third line.
</OL>
This is an Ordered List
  1. This is my first line.
  2. This is my second line.
  3. This is my third line.

You can also change way your list is displayed by using the TYPE command with the following:

  • Upper-case letters = TYPE="A"
  • Lower-case letters = TYPE="a"
  • Upper-case Roman Numerals = TYPE="I"
  • Lower-case Roman Numerals = TYPE="i"

EXAMPLE:

This is an Ordered List
<OL TYPE="A">
<LI>This is my first line.
<LI>This is my second line.
<LI>This is my third line.
</OL>
This is an Ordered List
  1. This is my first line.
  2. This is my second line.
  3. This is my third line.
This is an Ordered List
<OL TYPE="a">
<LI>This is my first line.
<LI>This is my second line.
<LI>This is my third line.
</OL>
This is an Ordered List
  1. This is my first line.
  2. This is my second line.
  3. This is my third line.
This is an Ordered List
<OL TYPE="I">
<LI>This is my first line.
<LI>This is my second line.
<LI>This is my third line.
</OL>
This is an Ordered List
  1. This is my first line.
  2. This is my second line.
  3. This is my third line.
This is an Ordered List
<OL TYPE="i">
<LI>This is my first line.
<LI>This is my second line.
<LI>This is my third line.
</OL>
This is an Ordered List
  1. This is my first line.
  2. This is my second line.
  3. This is my third line.

You can also change the order of the list by adding the START and VALUE commands.

This is an Ordered List
<OL START=2>
<LI>This is my first line.
<LI VALUE=1>This is my second line.
<LI>This is my third line.
</OL>
This is an Ordered List
  1. This is my first line.
  2. This is my second line.
  3. This is my third line.

Note the list will stay the START number until you change the VALUE in the <LI> tag.

back to top

bar gif [1,869 bytes]

- DEFINITION LISTS -

These lists are good for if you are wanting to indent text or create a definitions list.

This time the list begins with a:
<DL> (Definition List) tag, followed by the
<DT> (Definition Term) tag, then the
<DD> (I call this Definition Data) tag, and then finally closing with the
</DL> tag.

The <DD> tag indents the information allowing this to be a great method for the layout of a page if preferred.

EXAMPLE:

This is a Definition List
<DL>
<DT>This is how I show my lines.
<DD>This is my first line.
<DD>This is my second line.
<DD>This is my third line.
</DL>
This is a Definition List
This is how I show my lines.
This is my first line.
This is my second line.
This is my third line.

back to top

I hope this can give you a better idea on how to create Lists, or even using this method to align your text.


[ UPDATES ][ DISCLAIMER ][ EMAIL ][ GEOCITIES ][ SILICON VALLEY ][ SITE MAP ][ HOME ]
site © of websister 1997/98

1