Tutorial Part 2a - Tables  

The link I gave in Part 1 had far more information about HTML tags than most people would ever want to know, so I will just cover a few of the important ones here.
If you just write 'plain' html then the Browser will do its best to arrange it on the page for you, but there are some tags you can use to get more control over the layout. One of the most widely used is <TABLE> which divides the page up into a grid pattern. This can actually have lines round each 'box' or just act as an invisible way of aligning other tags. There are a number of 'sub-tags' that work inside a <TABLE>...</TABLE>pair, of these the most important are <TR>...</TR> which define a Row in the Table and <TD>...</TD> (the </TD> is optional) which define a Table Data Cell.
In a simple table it may help to think of a <TD> as the intersection of a row and column (but in fact it can 'occupy' more than one cell horizontally and vertically***).
Let's look at the HTML for a very simple table:

This will appear as:

Row1 Col1	Row1 Col2
Row2 Col1	Row2 Col2

Click on the link, then when the page opens, right-click on the page and select 'View Source' from the drop-down menu. When you have finished close the Source view and Click the 'Back' button in the Table.htm page.

You may have noticed that the 'Symbol' cell for 'UNKNOWN I' did not have a proper box around it - this is apparantly a 'feature' that has been around since the early days of HTML, it happens when a <TD> is empty (blanks don't count - HTML ignores them).
The work-around is to put in a special 'non-printable blank' character as I did for 'UNKNOWN II'. In HTML this is specified by the special string &nbsp; (Note the semi-colon at the end).

There are obvious similarities between HTML tables and tables in a word-processor document, and in fact this is a good way to build tables, *** you can even use the 'Join Cells' menu option to set <TD> colSpan and rowSpan attribute (q.v.)

Here is one I prepared earlier.