Discussion Forums HTML , XML , JavaScript ... Software Reviews Editors ,Others ... Top100 JavaScript Tutorials , ... Tutorials ASP , CSS , Databases ... Discussion List FAQ , Roundup , Configure ... Authoring HTML , JavaScript , CSS ... Design Layout , Navigation ,... Graphics Tools , Colors , Images ...
Software Browsers , Editors , XML ...
Internet Domains , E-Commerce , ... WDVL Resources Intermdiate, Tutorials ,... WDVL Discussion Lists , Top 100 ,... Technology Jobs
Basic Tables
Well, as I know you know by now, basic HTML does not actually give
you much control over where things go on your page.
For the most part, the browser gets to determine placement and you
are left simply communicating general layout instructions.
However with the introduction of HTML 3.2 in 1996 came the first
really powerful tools for HTML layout : Tables.
Tables give you the ability to position elements in your page with
much greater accuracy.
Of course, the original intent of HTML Tables was to provide a way
to present tabular data in rows and columns.
Thus the first tables looked something like the following:
Column One Header
Column Two Header
Row One/Column One
Row One/Column Two
Row Two/Column One
Row Two/Column Two
A table is composed of several tags that are outlined in the table
below:
OPENING/CLOSING TAG
DESCRIPTION
<TABLE>...</TABLE>
Specifies an HTML table. (By default the table will have no
borders)
<TR>...</TR>
Specifies a Table Row
<TH>...</TH>
Specifies a Table Header Cell
<TD>...</TD>
Specifies a Table Data Cell
Thus, the following code would create the very basic table that
was shown previously:
<HTML>
<HEAD>
<TITLE>Table Example</TITLE>
</HEAD>
<BODY>
<TABLE>
<TR>
<TH>Column One Header</TH>
<TH>Column Two Header</TH>
</TR>
<TR>
<TD>Row One/Column One</TD>
<TD>Row One/Column Two</TD>
</TR>
<TR>
<TD>Row Two/Column One</TD>
<TD>Row Two/Column Two</TD>
</TR>
</TABLE>
</BODY>
</HTML>
One thing to keep in mind about tables is that you may include any
Body HTML (i.e. markup that can go in the Body tag) in a table cell,
including tables. Thus you could make the contents of a cell bold with
the following table cell definition:
<TD><B>This text is bold</B></TD>
Additional Resources:
Exercise Eight Introduction to Web Design | Table of Contents Table Attributes
