logo.gif

Sample Tables

Here are several tables, pre-coded, that you can use and customize on your own page! Just copy and paste the coding below each table onto your own page. If you do not know how to copy and paste, go to the Copy and Paste tutorial on the Coding Tips page.

To help you follow the coding we have numbered and lettered each of the table cells. For example, R1C3 indicates Row 1 and Column 3. Some may seem out of sequence but these are the cells that are left over after using the ROWSPAN and COLSPAN attributes to customize the table layouts.

For a more detailed look at building tables, visit our Using Tables page!

R1C1 R1C2 R1C3 R1C4
R2C1 R2C2 R2C3 R2C4
R3C1 R3C2 R3C3 R3C4
R4C1 R4C2 R4C3 R4C4

The Coding for this table:

<TABLE border="2">
<TR>
<!-- Row 1 -->
<TD align="center"> R1C1 </TD>
<TD align="center"> R1C2 </TD>
<TD align="center"> R1C3 </TD>
>TD align="center"> R1C4 </TD>
</TR>
<TR>
<!-- Row 2 -->
<TD align="center"> R2C1 </TD>
<TD align="center"> R2C2 </TD>
<TD align="center"> R2C3 </TD>
<TD align="center"> R2C4 </TD>
</TR>
<TR>
<!-- Row 3 -->
<TD align="center"> R3C1 </TD>
<TD align="center"> R3C2 </TD>
<TD align="center"> R3C3 </TD>
<TD align="center"> R3C4 </TD>
</TR>
<TR>
<!-- Row 4 -->
<TD align="center"> R4C1 </TD>
<TD align="center"> R4C2 </TD>
<TD align="center"> R4C3 </TD>
<TD align="center"> R4C4 </TD>
</TR>
</TABLE>

R1C1 R1C2 R1C4
R2C1 R2C4
R3C1 R3C4
R4C1 R4C4

The Coding for this table:

<TABLE border="2">
<TR>
<!-- Row 1 -->
<TD align="center"> R1C1 </TD>
<TD align="center" colspan="2" rowspan="4"> R1C2 </TD>
<TD align="center"> R1C4 </TD>
</TR>
<TR>
<!-- Row 2 -->
<TD align="center"> R2C1 </TD>
<TD align="center"> R2C4 </TD>
</TR>
<TR>
<!-- Row 3 -->
<TD align="center"> R3C1 </TD>
<TD align="center"> R3C4 </TD>
</TR>
<TR>
<!-- Row 4 -->
<TD align="center"> R4C1 </TD>
<TD align="center"> R4C4 </TD>
</TR>
</TABLE>

R1C1
R2C1 R2C2 R2C3 R2C4
R3C1
R4C1 R4C2 R4C3 R4C4

The Coding for this table:

<TABLE border="2">
<TR>
<!-- Row 1 -->
<TD align="center" colspan="4"> R1C1 </TD>
</TR>
<TR>
<!-- Row 2 -->
<TD align="center"> R2C1 </TD>
<TD align="center"> R2C2 </TD>
<TD align="center"> R2C3 </TD>
<TD align="center"> R2C4 </TD>
</TR>
<TR>
<!-- Row 3 -->
<TD align="center" colspan="4"> R3C1 </TD>
</TR>
<TR>
<!-- Row 4 -->
<TD align="center"> R4C1 </TD>
<TD align="center"> R4C2 </TD>
<TD align="center"> R4C3 </TD>
<TD align="center"> R4C4 </TD>
</TR>
</TABLE>

R1C1 R1C2 R1C3
R2C1 R2C2
R3C1 R3C3 R3C4
R4C3 R4C4

The Coding for this table:

<TABLE border="2">
<TR>
<!-- Row 1 -->
<TD align="center"> R1C1 </TD>
<TD align="center"> R1C2 </TD>
<TD align="center" colspan="2" rowspan="2"> R1C3 </TD>
</TR>
<TR>
<TD align="center"> R2C1 </TD>
<TD align="center"> R2C2 </TD>
</TR>
<TR>
<!-- Row 3 -->
<TD align="center" colspan="2" rowspan="2"> R3C1 </TD>
<TD align="center"> R3C3 </TD>
<TD align="center"> R3C4 </TD>
</TR>
<TR>
<!-- Row 4 -->
<TD align="center"> R4C3 </TD>
<TD align="center"> R4C4 </TD>
</TR>
</TABLE>





~~~~~ Back to "Using Tables" ~~~~~