TABLES
YOUR GRADED ASSIGNMENT
Add to a project page a 5 Cell (or greater)
TABLED THUMBNAIL PICTURE GALLERY
Get 5 larger images and use a PAINT program to
RESIZE AND RENAME
these into 5 additional smaller versions called "thumbnails"
(A total of 10 pics in all).
Shrink (RESIZE) and RENAME with the SAVE AS function
(e.g. flower.gif --> flower_sm.gif ).

TABLES are great for :

a 2 x 2 table the code
row 1 col 1 row 1 col 2
row 2 col 1 row 2 col 2
<table border="1">
<tr>
<td>row 1 col 1 </td>
<td>row 1 col 2 </td>
</tr>
<tr>
<td>row 2 col 1</td>
<td>row 2 col 2 </td>
</tr>
</table>

For every <tr>.....</tr> a new row is started.
For every <td>...</td> a cell is added to that row.
TEXT or IMAGES can be coded between every <td> and </td>

a 1 x 4 table the code
row 1 col 1
row 2 col 1
row 3 col 1
row 4 col 1
<table border="1">
<tr>
<td>row 1 col 1</td>
</tr>
<tr>
<td>row 2 col 1</td>
</tr>
<tr>
<td>row 3 col 1</td>
</tr>
<tr>
<td>row 4 col 1</td>
</tr>
</table>

a 3 x 1 table the code
row 1 col 1 row 1 col 2 row 1 col 3
<table border="1">
<tr>
<td>row 1 col 1</td>
<td>row 1 col 2 </td>
<td>row 1 col 3 </td>
</tr>
</table>

Look at all the crazy table options!
This table is 2 columns by 3 rows This is Column 2 Row 1
This is Column 1 Row 2 This is Column 2 Row 2
This is Column 1 Row 3

The code to make the CRAZY UGLY TABLE above is:

<table border="1" cellpadding="10" cellspacing="5" background="colorwheel.jpg">

<tr>
<td align="center" valign="bottom">This table is 2 columns by 3 rows</td>
<td align="right" valign="top">This is Column 2 Row 1</td>
</tr>

<tr>
<td align="center" valign="bottom" bgcolor="#FFFF00">This is Column 1 Row 2</td>
<td align="right" valign="top">This is Column 2 Row 2</td>
</tr>

<tr>
<td align="center" valign="bottom" background="home.gif">This is Column 1 Row 3</td>
<td align="right" valign="top"><img src="home.gif" ></td>
</tr>

</table>

If you set border="0" then the "window pane" disappears. This can be quite useful to organize
pictures and text next to each other (in adjacent table cells) for the news column effect.

Individual cells can also be merged (spanned).

spanned row
1 2 3 spanned column
4 5 6
7 8 9

The code to make the funky TABLE above is:

<table width="400" border="1" align="center" bordercolor="#FF0000">
<tr bgcolor="#00FF00">
<td colspan="4">spanned row </td>
</tr>
<tr>
<td width="100">1</td>
<td width="100">2</td>
<td width="100">3</td>
<td rowspan="3" bgcolor="#00FFFF">spanned column</td>
</tr>
<tr>
<td width="100">4</td>
<td width="100">5</td>
<td width="100">6</td>
</tr>
<tr>
<td width="100">7</td>
<td width="100">8</td>
<td width="100">9</td>
</tr>
</table>

For more sophisticated tables it is best to use an HTML editor
like Frontpage or Dreamweaver .
2 cell tabled thumbnail picture gallery & sample code:
My bud albert Filo my hero

- Clicking on the small image loads the BIG in a new window -

<table border="1">
<tr>
<td> <a href="einstein.jpg" target="new"><img src="einstein_sm.jpg" border="0"></a> </td>
<td> <a href="farnsworth.jpg" target="new"><img src="farnsworth_sm.jpg" border="0"></a> </td>
</tr>
<tr>
<td>My bud albert </td>
<td>Filo my hero </td>
</tr>
</table>