TABLES
Tables are used in the web page to organize text, graphics, and data into rows and columns. Tables are actually created by the user's browser, you merely provide the instructions to that browser as to how IT should create the page. You supply the table size, the border thickness, the border color and background colors, You set the numbers of rows and cells (actually there are no columns, just cells nested within rows).
To Start a table use the <TABLE> tag. Within the table tag you can set the Width of the table. It is always a good idea to set the width. If you do not, the user's browser will determine the width by the amount of text being nested, and the results can be unpredictable. Usually a width of 80% to 90% is fine for most tables. The width can be set in percentage of the window width, or to a specific pixel width. When nesting thumbnail images into a table, setting the exact pixels is useful. This way different users on different monitors will see a similar table. Leave out the percentage sign when setting it to pixels.
<TABLE WIDTH="80%"> or <TABLE WIDTH="144">
Next you set whether you want the border to be visible and how thick you want it to be. The default is three (3) pixels. The border is always set in pixels. The border color can be flat by using BGCOLOR or 3-D by using BORDERCOLORLIGHT (upper and left borders) and BORDERCOLORDARK, right and bottom borders.
<TABLE WIDTH="80%" BORDER="5">
<TABLE WIDTH="80%" BORDER="15" BORDERCOLOR="#0000FF">
<TABLE WIDTH="80%" BORDER="15" BORDERCOLORLIGHT="#DDDDDD" BORDERCOLORDARK="#555555">
The space between interior cells of a table is the CELLSPACING, set in pixels. The distance between the text and the interior borders is the CELLPADDING.
<TABLE CELLPADDING="10" CELLSPACING="15">
After the table tag, you are ready to begin constructing your table. One thing to consider is whether you want a CAPTION, that is a title, to your table. The CAPTION is nested INSIDE you <TABLE> tag, so that when you cut and move your table, the caption is moved along with the rest of your table. <TABLE WIDTH="80%"><CAPTION>Sales Figures</CAPTION> Now you are ready to build the cells themselves. All cells are nested inside a row. To make a table look even, you need to have the same number of cells on each row, even if there is not data in the cell. The tag to introduce a table's row is <TR>. Once the row is introduced, you can begin filling it with cells.
<TABLE BORDER="3">
<TR>
<TD>Cell
One</TD>
<TD>Cell
Two</TD>
<TD>Cell
Three</TD>
<TD>Cell
Four</TD>
</TR>
</TABLE>
The above one row, four cell table was deliberately indented to make it easier
to track rows and cells. It is a good idea to use lots of indention on larger
tables to keep track of cells in your source code.
The above table looks like this:
| Cell One | Cell Two | Cell Three | Cell Four |