| Publish and Be... | |
|
...Tabular! |
You define a table in HTML using
a series of tags, which form a table-defining block. It's not as hard as it sounds,
although you do have to get used to writing HTML vertically down the page, while thinking
horizontally about the rows you're creating. Hopefully these examples will make things
clear!
Three main HTML tag types are used to create tables:
<TABLE> which marks the start of a
table definition
<TR>
(Table Row), which marks the start of a new row (horizontal line) of cells.
<TD>
(Table Data), which defines an individual table cell.
All three tags have corresponding terminator tags (</TABLE>, <TR> and </TD>), which you include in the table-defining code block, as shown below.
Here's the HTML for a three-column, two-row table, along with the results displayed by the browser:
The red lines show the relationship between the browser's display and the <TR> and <TD> tags which define the second row of the table. Note how the terminator tags are used. The <TABLE>...</TABLE> tag-pair encloses the entire table definition, while each <TR>...</TR> pair encloses a series of individual cell definitions. These are created using <TD>...</TD> pairs - in between these tags you can place any standard page content (text, <IMG> tags, forms etc) you like.
Note also that, unlike the row-defining <TR>, there's no specific tag for a column - that's because the browser simply counts the number of <TD> tags (cell definitions) in each row and builds the column structure from that. You don't even have to have the same number of columns in each row - click here for details of how to build irregular-shaped tables.