Tables

In the spirit of "why remake the wheel when there's a good one already rolling around", this page was taken ad hoc (with a few modifications) from the Netscape pages on tables. You'll find a complete description of all the Table tags there.


TABLES: A Simple Table

Here is a simple table example, -- a table with 3 rows and 4 columns

<TABLE BORDER>
<caption align="bottom">This is the Table Caption</caption>
<TR> <TH>Heading 1 <TH> Heading 2 <TH> Heading 3 <TH>Heading 4 </TR>
<TR> <TD> 0.32 </TD> <TD> 1.2 </TD> <TD> 3.2 </TD> <TD>Alpha </TD> </TR>
<TR> <TD> 0.44 </TD> <TD> 0.3 </TD> <TD> 7.2 </TD> <TD> Beta </TD> </TR>
</TABLE>

This table is displayed as:

This is the Table Caption
Heading 1 Heading 2 Heading 3 Heading 4
0.32 1.2 3.2 alpha
0.44 0.3 7.2 beta

TABLE Attribute Extensions

Netscape Navigator supports several attribute extensions. You can assign a number to the BORDER attribute to specify the width, in pixels, of the outside table border. You can also assign numbers to the CELLPADDING and CELLSPACING attributes. CELLPADDING defines the space, in pixels, between the cell contents and the cell borders, while CELLSPACING defines the space between the cells (the width of the borders).

Finally, the WIDTH attribute sets the width of the entire table. This can be expressed as an absolute number (in pixels) or as a percentage width of the entire display.

Simple Table Examples

Here are some simple tables, showing how the Netscape Navigator-specific WIDTH, CELLSPACING, CELLPADDING and BORDER attributes work:

<table border>
<TR> <TH> Head 1 <TH> Head 2 </TR>
<TR> <TD> 4.11   <TD> 4.23   </TR>
</table>
Head 1 Head 2
4.11 4.23 
<table border=8>
<TR> <TH> Head 1 <TH> Head 2 </TR>
<TR> <TD> 4.11   <TD> 4.23   </TR>
</table>
Head 1 Head 2
4.11 4.23 
<table border cellpadding=8>
<TR> <TH> Head 1 <TH> Head 2 </TR>
<TR> <TD> 4.11   <TD> 4.23   </TR>
</table>
Head 1 Head 2
4.11 4.23 
<table border cellspacing=8>
<TR> <TH> Head 1 <TH> Head 2 </TR>
<TR> <TD> 4.11   <TD> 4.23   </TR>
</table>
Head 1 Head 2
4.11 4.23 
<table border width=80%>
<TR> <TH> Head 1 <TH> Head 2 </TR>
<TR> <TD> 4.11   <TD> 4.23   </TR>
</table>
Head 1 Head 2
4.11 4.23 
<table border width=80>
<TR> <TH> Head 1 <TH> Head 2 </TR>
<TR> <TD> 4.11   <TD> 4.23   </TR>
</table>
Head 1 Head 2
4.11 4.23 
<TABLE BORDER WIDTH=40%>
<TR> <TD> 1.1 <TD> 1.2       <TD> 1.3           <TD> 1.4 </TR>
<TR> <TD> 2.1 <TD COLSPAN=2>      2.2           <TD> 2.4 </TR>
<TR> <TD> 3.1 <TD> 3.2       <TD ROWSPAN=3> 3.3 <TD> 3.4 </TR>
<TR> <TD> 4.1 <TD> 4.2                          <TD> 4.4 </TR>
<TR> <TD> 5.1 <TD> 5.2                          <TD> 5.4 </TR>
</TABLE>

The above table is displayed as....

1.1 1.2 1.3 1.4
2.1 2.2 2.4
3.1 3.2 3.3 3.4
4.1 4.2 4.4
5.1 5.2 5.4

Back to Document Color
Index

Back to the Ziplink 101 page       ©2000 ZipLink. All Rights Reserved.