Lists

Lists are very useful for organizing the contents of your document and breaking up the uniformity of a dense text page.

 

  • Unordered Lists:

    This is a typical unordered list. Notice how the <UL> tag opens the list and the </UL> tag closes it:
The code:

<UL>
<LI>First element.
<LI>Second element.
<LI>Third element.
</UL>

 The result:
  • First element.
  • Second element.
  • Third element.

You can specify the type of bullet with the property TYPE. There are three types: circle, square, disc. The list above uses the default type disc (that is, if you don't specify the type of unordered list, it defaults to disc). See how the other two look:

The code:

This is your paragraph.
<P>
<UL TYPE="square">
<LI>First element.
<LI>Second element.
<LI>Third element.
</UL>

 The result:

This is your paragraph.

  • First element.
  • Second element.
  • Third element.
   
The code:

This is your paragraph.
<P>
<UL TYPE="circle">
<LI>First element.
<LI>Second element.
<LI>Third element.
</UL>

   The result:

This is your paragraph.

  • First element.
  • Second element.
  • Third element.

As you can see by the results, the list elements get indented in relation to the regular text.

 

 

  • Ordered Lists:

    The way to construct ordered lists is the same as for the unordered list. The opening tag now becomes     <OL>, and the closing tag is </OL>.
The code:

<OL>
<LI>First element.
<LI>Second element.
<LI>Third element.
</OL>

The result:
  1. First element.
  2. Second element.

  3. Third element.

As with the unordered list, the ordered list has several types that can be specified in the type property: A, a, I, i, 1 (this one being the default type):

 

The code:

<OL TYPE="I">
<LI>First element.
<LI>Second element.
<LI>Third element.
</OL>

 The result:
  1. First element.
  2. Second element.
  3. Third element.
   
The code:

<OL TYPE="i">
<LI>First element.
<LI>Second element.
<LI>Third element.
</OL>

  The result:
  1. First element.
  2. Second element.
  3. Third element
   
The code:

<OL TYPE="A">
<LI>First element.
<LI>Second element.
<LI>Third element.
</OL>

  The result:
  1. First element.
  2. Second element.
  3. Third element
   
The code:

<OL TYPE="a">
<LI>First element.
<LI>Second element.
<LI>Third element.
</OL>

  The result:
  1. First element.
  2. Second element.
  3. Third element


  • Definition Lists:

    This type of list differs in its code from the other lists. There are three parts to the structure of this list: the opening and closing tags     <DL></DL>; the definition term within the <DT> </DT>, and the definition itself, with its opening and closing tags <DD></DD>. Note the indentation in the definition.
The code:

<DL>
<DT>My term:</DT>
<DD>The definition of my term.
</DD>
</DL>

 The result:
My term:
The definition of my term.