Hand-code a table

You'll need the "Summary" page from my section on table-coding to complete this.

1. Open Windows Notepad (Start/Programs/Accessories/Notepad), and save a blank file on your A: disk as start2.htm

2. Type this first:

     <HTML>
     <HEAD>
        <TITLE>My first table</TITLE>
     </HEAD>
     <BODY BGCOLOR="ffffff">


     </BODY></HTML>

3. Then type in the BODY section the code from the "1. Basic code" section of the Summary page. This gives you a table with one row and two columns.

4. Add the attributes for 2. WIDTH and 3. VALIGN.  This gives you a table that's as wide as the page (100%) and is subdivided into 20 and 80% width columns. The VALIGN tag just makes stuff in your tables stick to the top of the table - like what you're used to seeing in a word processor.

5. Add the attribute for 4. BORDER, but set it to border=1 instead of border=0.  This will allow you to see the border when you view the page in a browser.

6. Type a bit of content between your <TD> cells - put "Home" between the first two, and "Welcome to my home page" between the second.

7. Save your page, then open it in a browser.  


Done already?  Add some color to your page - follow the code for 5. BGCOLOR.  Note that BGCOLOR can apply at the TABLE, TR, or TD level.  Hmmm...for our simple table, it's probably best just to pick a color for each TD tags.  Add one for the page BACKGROUND, too (right now it's FFFFFF - white).  Here are some useful colors:

   EEEEEE - light gray       000066 - Navy          0000ff - primary blue
CCCCCC - darker gray ffcc33 = Gold ff0000 - primary red
999999 - charcoal cccc99 - Khaki 66ff00 - electric lime
FFFFFF - white 999966 - Olive ff3300 - tangerine 000000 - black 990033 - Cardinal ff00ff - fuschia