mimistructures.gif (11798 bytes)

Questions or Requests??
Please Be As Specific Possible

email4.gif (24497 bytes)


An important HTML tag type is the List. HTML supports three types
of lists: ordered lists, unordered lists, definition lists. All lists begin and
end with an implicit <P> and, except for the definition list (see below), they
all take the form:

<LH> Optional list header </LH>
<LI> Item in the list </LI>
<LI> Item in the list </LI>

Ordered Lists use <OL> to open the list and </OL> to close the list.

  1. The items in an ordered list look like this.
  2. But the list doesn't have to be numbered!
  1. <OL TYPE=A> causes the list
  2. to be lettered in CAPS
  1. <OL TYPE=a> causes the list
  2. to be lettered in lower case
  1. <OL TYPE=I> causes the list
  2. to be numbered with large Roman Numerals
  1. <OL TYPE=i> causes the list
  2. to be numbered in small Roman Numerals
  1. And you can even start somewhere
  2. other than the beginning with <OL START=##>,
  3. where ## is the starting number. (Translate letters and numerals into their corresponding
    numbers, i.e. E=5, b=2, III=3, etc.)

To start the numbering at a specific place, add SEQNUM=num to the <OL ... >tag,
where num is the number to start the numbering with.
Adding CONTINUE to the <OL ... > tag will pick up the numbering of this list
where the last list left off.

So, a list starting at 49 would look like this:


Unordered Lists use <UL> </UL> to open and close the list.

The unordered list can be modified by adding tags to the opening <UL ... > tag.
Adding PLAIN will create a list with no bullets. Adding WRAP= will make your list
"wrap" into columns. WRAP=vert will make the list start a new column after reaching
the bottom of the page. WRAP=horiz will make the list divide into as many columns
as the page has room for. To use some other image instead of the standard bullet, include
SRC="picture", where picture is a link to the image you want to use. (See the lesson: Links)

An unordered list with no bullets that wraps vertically would look like this:


NOTE: Here's a neat trick. If you want something indented, you can use and unordered list.
Just put your text in an unordered list with no list items.




Definition lists are two-part lists, useful for things like glossaries or defining lists of terms. <DL> </DL> is used to open and close the list. The list items have two parts: the term and the definition. The definition term is enclosed in <DT> </DT> and should precede the definition definition. The definition definition is enclosed in <DD> </DD>. A list header can also be added as with the other list types. So, the whole thing looks like:

<LH> list header <DL>
<DT> term </DT> <DD> definition </DD>
<DT> term </DT> <DD> definition </DD>

NOTE: The definition term and the definition definition do NOT have to
be on the same line like in the example.

Definition List:
This is how they look when viewed with a browser.
Their Use:
They are useful for any list shaped like this!

One useful feature of lists is that they can be nested, i.e. one
lists is a List Item of another list, like this:

<LI>You can have one list...</LI>
<LI>Inside of another list...</LI>
<LI>Inside of another!</LI>

Which looks like this:

Tables are 2-dimensional lists. They are coded similarly to definition lists.
They have an implicit <BR> at the beginning and end. The format is:

<TR> <TD> Table Entry </TD> ... <TD> Table Entry </TD> </TR>
<TR> <TD> Table Entry </TD> ... <TD> Table Entry </TD> </TR>

Each row is encapsulated in <TR> </TR>. Within the row are cells, enclosed in <TD> </TD>.
The whole table is opened and closed with <TABLE> </TABLE>. There can be as many rows
and columns as you want and as will fit on the screen. The browser will autoformat the
rows,vertically centering cell contents if necessary.

If you want a cell to span more than one column, enclose it in <TD COLSPAN=##>
</TD>, where ## id the number of columns to span. Similarly, <TD ROWSPAN=##>
</TD> will cause the cell to span ## rows. A border can the placed around all the cells by
using <TABLE BORDER=##> </TABLE>, where ## is the number of pixels
thick the border should be.

<table border="1"><tr><td>
<tr><td colspan="2">INFORMATION</td>
<td rowspan="2">!!!</td></tr>
<tr><td colspan="2">You Want</td></tr></table>

Tables can contain
any amount of
You Want

Centering can be accomplished with the <CENTER> </CENTER> tags,

<CENTER>Like this!</CENTER>

NOTE: Structures such as centering, tables, lists and headings sometimes
ignore formatting applied outside of the structure's limits. So,
<B><CENTER> text </CENTER></B> may not make "text" bold.
<CENTER><B> text</B> </CENTER> may be needed in this case.

Back to Menu

More TexasCook Destinations

Associates of TxCk Family

Page Design By