|
|
Introducton to Web Design
|
|
|
|
|
- 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 2.0 in 1995 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 TAG |
CLOSING TAG |
DESCRIPTION |
| <TABLE> |
</TABLE> |
Specifies an HTML table. (By default the table will have no
borders) |
| <TH> |
</TH> |
Specifies a Table Header Cell |
| <TR> |
</TR> |
Specifies a Table Row Cell |
| <TD> |
</TD> |
Specifies a Table Column 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 incorporate
regular HTML formatting tags within a table. Thus you could make the
contents of a cell bold with the following table cell definition:
<TD><B>This text is bold</B></TD>
Previous Page |
Next Page
|
|