Tables are useful for the presentation of tabular information.
A table has an optional caption or title, optional column headings,
rows for information, and cells for each item where a column and
row intersect.
In the following table, the first column contains the header
information, each row explains an HTML table tag, and each cell
contains a paired tag or an explanation of the tag's function.
Table Elements
|
|
Element
|
Description
|
|
<TABLE> ... </TABLE>
|
Defines a table in HTML. If the BORDER attribute displays
the table with a border.
|
|
<CAPTION> ... </CAPTION>
|
Defines the caption for the title of the table. The default
position of the title is centered at the top of the table.
The attribute ALIGN=BOTTOM can be used to position the
caption below the table.
Note: Any kind of markup tag can be used in the
caption.
|
|
<TR> ... </TR>
|
Specifies a table row within a table. you may define
default attributes for the entire row: ALIGN (LEFT, CENTER,
RIGHT) and/or VALIGN (TOP, MIDDLE, BOTTOM). See Table
Attributes at the end of this table for more information.
|
|
<TH> ... </TH>
|
Defines a table header cell. By default the text in this
cell is aligned left and centered vertically. Table data
cells may contain other attributes to determine the characteristics
of the cell and/or it's contents. See Table Attributes
at the end of this table for more information.
|
|
<TD> ... </TD>
|
Defines a table data cell. By default the text in this
cell is aligned left and centered vertically. Table data
cells may contain other attributes to determine the characteristics
of the cell and/or it's contents. See Table Attributes
at the end of this table for more informaiton.
|
Table Attributes
|
|
Note: Attributes defined within <TH> ...
</TH> or <TD> ... </TD> cells override
the default alignment set in a <TR> ... </TR>
|
|
Attribute
|
Description
|
|
ALIGN (LEFT, CENTER, RIGHT)
|
Horizontal alignment of a cell.
|
|
VALIGN (TOP, MIDDLE, BOTTOM)
|
Vertical alignment of a cell
|
|
COLSPAN=n
|
The number (n) of columns of a cell.
|
|
ROWSPAN=n
|
The number (n) of rows in a cell.
|
|
NOWRAP
|
Turn off word wrapping within a cell.
|
General Table Format
|
|
The general format of a table looks like this
|
|
<TABLE>
<!-- start of table definition -->
<CAPTION> caption contents </CAPTION>
<!-- caption definition -->
<TR>
<!-- start of header row definition -->
<TH> first header cell contents
</TH>
<TH> last header cell contents
</TH>
</TR>
<!-- end of header row definition -->
<TR>
<!-- start of first row definition -->
<TD> first row, first cell contents
</TD>
<TD> first row, last cell contents
</TD>
</TR>
<!-- end of first row definition -->
<TR>
<!-- start of last row definition -->
<TD> last row, first cell contents
</TD>
<TD> last row, last cell contents
</TD>
</TR>
<!-- end of last row definition -->
</TABLE>
<!-- end of table definition -->
|
You can cut-and-paste the above code into your own
HTML documents, adding new rows or cells as necessary. The <TABLE>
and </TABLE> tags must surround the entire table definition.
The first item inside the table is the CAPTION, which is optional.
Then you can have any number of rows defined by the <TR>
and </TR> tags. Within a row you can have any number of
cells defined by the <TD>...</TD> or <TH>...</TH>
tags. Each row of a table is, essentially, formatted independently
of the rows above and below it. This lets you easily display tables
like the one above with a single cell, such as Table Attributes,
spanning columns of the table.
|
I