|
|
 |
Welcome to Tom's Web |
Now we will make a page using this information we have learned.
First we will make a table width of 100% with 4 rows an 4 division in each row.
| This is a table division with valign="top" align="left" | This is a table division with valign="middle" align="right" | This is a table division with valign="baseline" align="center" | This is a table division with valign="bottom" align="justify" |
| This is a cell with an image for a babkgrounr with texr over it |  This
is a cell with an image and text with image background |
This cell has an image and text set background |
This has a color set background |
 |
This has a .gif background |  |
|
 |
 |
The codes for this table look like this befor we do any thing to it.
<center>
<table border="8" cellpadding="8" cellspacing="8" width="100%" bordercolor="#FFFF00" bordercolorlight="#00FFFF" bordercolordark="#0000FF" bgcolor="#C0C0C0"> <tr> <td width="25%"> </td> <td width="25%"> </td> <td width="25%"> </td> <td width="25%"> </td> </tr> <tr> <td width="25%"> </td> <td width="25%"> </td> <td width="25%"> </td> <td width="25%"> </td> </tr> <tr> <td width="25%"> </td> <td width="25%"> </td> <td width="25%">& </td> <td width="25%"> </td> </tr> <tr> <td width="25%"> </td> <td width="25%"> </td> <td width="20%"> </td> <td width="25%"> </td> </tr> </table> </center>
Now the codes look like this see is you can understand them.
<center>
<table border="8" cellpadding="8" cellspacing="8" width="100%" bordercolor="#FFFF00" bordercolorlight="#00FFFF" bordercolordark="#0000FF" bgcolor="#C0C0C0"> <tr> <td width="25%" valign="bottom" align="justify">This is a table divisionwith <font COLOR="#0000c0">valign=</font><font COLOR="#000000">"top"</font><font COLOR="#0000c0">
align=</font><font COLOR="#000000">"left"</font></td>
<td width="25%" valign="middle" align="right" background="Back2.jpg"><b><font color="#FF0000">Thisis a table division with valign="middle" align="rig</font><font COLOR="#000000">ht"</font></b></td>
<td width="25%" valign="baseline" align="center">This is a tabledivision with <font COLOR="#0000c0">valign=</font><font COLOR="#000000">"baseline"</font><font COLOR="#0000c0">
align=</font><font COLOR="#000000">"center"</font></td>
<td width="25%" valign="bottom" align="justify">This is a table divisionwith <font COLOR="#0000c0">valign=</font><font COLOR="#000000">"bottom"</font><font COLOR="#0000c0">
align=</font><font COLOR="#000000">"justify"</font></td>
</tr> <tr> <td width="25%" background="logo10.gif"><font color="#FF0000"><b>This isa cell with an image for a babkgrounr with texr over it</b></font></td>
<td width="25%" background="logo10.gif" valign="top" align="left"><img border="0" src="float1.gif" width="45" height="60"><font color="#FF0000"><b>Thisis a cell with an image and text with image background</b></font></td>
<td width="25%" bgcolor="#000000" valign="middle" align="center"><img border="0" src="float1.gif" width="45" height="60"><font color="#FF0000">This cell has an image and text set background</font></td>
<td width="25%" bgcolor="#FFFF00" valign="middle" align="center"><font color="#0000FF">Thishas a color set background</font></td>
</tr> <tr> <td width="25%" background="pattern.jpg"> </td> <td width="25%" valign="middle" align="center" bgcolor="#00FF00"><img border="0" src="logo_Web_button3.gif" width="260" height="46"></td> <td width="25%" background="sand.gif">This has a .gif background</td> <td width="25%" bgcolor="#FF0000"><img border="0" src="pattern.jpg" width="128" height="128"></td> </tr> <tr> <td width="25%" background="back.jpg"> </td> <td width="25%" bgcolor="#00FFFF" valign="middle" align="center"><img border="0" src="logo_Web4_ann.gif" width="360" height="63"></td> <td width="20%" background="marblue.jpg" valign="middle" align="center"><img border="0" src="tlogo.gif" width="144" height="27"></td> <td width="25%" background="logo10_s.gif" valign="middle" align="center" bgcolor="#00FF00"> </td> </tr> </table> </center>
Next will learn how do we go to the next page . Using hyperlinks.