Tables are used for presenting tabular data but many designers use them to help layout their pages.
Tables can be inserted anywhere on the page, even within other tables. A table cell can contain text, images, movies, applets or other tables.
We will be looking at creating a basic table and then adding lots of tags to it so we can see just what the outcome will be. Experimentation is the name of the game here.
Tables can be inserted anywhere on the page, even within other tables. A table cell can contain text, images, movies, applets or other tables.
We will be looking at creating a basic table and then adding lots of tags to it so we can see just what the outcome will be. Experimentation is the name of the game here.
<TABLE>
<TR> <TD>Pencil</TD> <TD>5 Boxes</TD> </TR>
<TR> <TD>Bond Paper</TD> <TD>100 Sheets</TD> </TR>
<TR> <TD>Paper Clip</TD> <TD>3 Boxes</TD> </TR>
<TR> <TD>Stapler</TD> <TD>10 Pieces</TD> </TR>
</TABLE>
Which gives us this table:
| Pencil | 5 Boxes |
| Bond Paper | 100 Sheets |
| Paper Clip | 3 Boxes |
| Stapler | 10 Pieces |
This table uses the basic three tags all tables must have:
<TR ...> (Table Row) defines each row of the table.
<TD ...> (Table Data) defines each cell of the table.
The first modification we'll make to this little table is to add borders. Borders will help us see how the table is laid out. It's a good idea when designing a table to add borders during the time you design the table, even if you remove them before making the table public.
<TABLE BORDER="2">
<TR> <TD>Pencil</TD> <TD>5 Boxes</TD> </TR>
<TR> <TD>Bond Paper</TD> <TD>100 Sheets</TD> </TR>
<TR> <TD>Paper Clip</TD> <TD>3 Boxes</TD> </TR>
<TR> <TD>Stapler</TD> <TD>10 Pieces</TD> </TR>
</TABLE>
which gives us
| Pencil | 5 Boxes |
| Bond Paper | 100 Sheets |
| Paper Clip | 3 Boxes |
| Stapler | 10 Pieces |