Table Basics

Section 1 - Introduction
Section 2 - Basics
Section 3 - Next Level
      Lists
      Basic Tables
         Table basics
         Rows and data
         Borders
         Width
         Cellpadding & spacing
         Alignment
         Rowspan & colspan
         You Try It
      Advanced Text
      Marquee
      Meta
      Sounds
      Comments
Section 4 - Advanced
Section 5 - Publishing
Section 6 - Extras
Appendices
Tables
TAGS USED: <table> </table> <tr> </tr> <td> </td>
Tables begin with a tag that's easy to remember. The tag is simply <table>. Be extra careful to ALWAYS finish the tag with </table> or your whole page will be a mess. When you have a table, you can't put anything along side of the table (yet) but can only have items above and below it.

If you only use these two tags, here's what you'd see:
Code
This is a line of text that I put above the table.
<table>
This is a line of text I put in the table.
</table>
This is a line of text I put after the table.
What you see
This is a line of text that I put above the table. This is a line of text I put in the table.
This is a line of text I put after the table.
Well, that was pointless. You need more information to get a table to work.

After you have defined an area as a table, you need to put in rows. A table row is defined by the tag <tr>. Each separate row of the table will need to be defined. So far we have:
<table>
      <tr> </tr>
</table>


We have now defined a one-row table. Still, this is not enough because we need to put data on the table. This is done with the tag <td>, which stands for "table data." When you put all of these things together, we see:
<table>
      <tr>
          <td></td>
      </tr>
</table>


Now we're getting somewhere. Let's look at the table we made earlier with the row and data defined.
Code
This is a line of text that I put above the table.
<table>
<tr>
<td>

This is a line of text I put in the table.
</td>
</tr>
</table>

This is a line of text I put after the table.
What you see
This is a line of text that I put above the table.
This is a line of text I put in the table.
This is a line of text I put after the table.
You must use all three of these tags to make your table work. From here's it's easy to make a table with more than one area (or section of data). This can be done with more rows or more data.
Back Home Forward