HTML Cookbook

Recipes for tasty webpages from
html.help.gnubee
Home of the MALLRATS




Introduction To Tables


Tables are extremely important in building webpages. I consider them to be the "swiss army knife" of html. Tables are the breakfast of champions! Tables are your friend!

They are mostly used for aligning things (think layout), but as we shall see, they are very versatile & they have many applications.

You can use tables to:
  • place one image on top of another
  • put a fancy (imaged) border around an image
  • put multiple borders around an image
  • build a mini webpage inside another webpage
  • record your favorite team's wins & losses
  • make a checkbook register
  • make a spreadsheet
  • make a mileage log
  • make an appointment book
  • make a bowling scoresheet
  • make a calendar
  • make a greeting card
  • make business cards
  • make personalized labels & stationery
  • make friends & influence people


The possibilities are almost endless.
Tables are fun.
Tables are very, very cool
Can you tell that we like tables?

We'll start with the basics, then we'll move on to some fancy (but easy) stuff like gradcolors. New table builders often think that tables are difficult to understand, but just take a little time to learn their principles & you'll find them to be an essential tool in your arsenal of web-building techniques.

As always, close your tags in reverse order of opening them. I'll spread them out to show their heirarchy. Here we go, the most basic layout:

<table> (open your table)
   <tr> (open a row)
     <td> (open a data cell)
       Info (data) goes here, such as an image
     </td> (close the data cell)
   </tr> (close the row)
</table> (close your table)


<table> & </table> start & end your table.

<tr> & </tr> determine a table row. You can have as many rows as you want.

<td> & </td> determine a table data cell You can have more than one data cell in a row. Each data cell in a row determines a column.



Back To Index
More Mallrats Tutorials