Table Tutorial

Basic Structure

All tables require at least three tags: <table>, <tr>, and <td> (in that order).

Start with your <table> tag.

<table>
</table>

To add a row, add a <tr> and </tr> after <table>.

<table>
    <tr>
    </tr>
</table>

To add a column, add a <td> and </td> after <tr>. Columns must be inside the rows.

<table>
    <tr>
        <td>
        </td>
    </tr>
</table>

Your text and other content must go inside the <td> and </td> tags.

Table Example

Column 1, Row 1Column 2, Row 1
Column 1, Row 2Column 2, Row 2
Column 1, Row 3Column 2, Row 3

Table Example Code

This is the code for a table with two columns and four rows.

<table>
    <tr>
        <td>Column 1, Row 1</td>
        <td>Column 2, Row 1</td>
    </tr>
    <tr>
        <td>Column 1, Row 2</td>
        <td>Column 2, Row 2</td>
    </tr>
    <tr>
        <td>Column 1, Row 3</td>
        <td>Column 2, Row 3</td>
    </tr>
</table>

Style

You can add specifications for the table or certain rows or columns. Add any of the following codes into the <table>, <tr>, or <td> tags.

border="2"
Border width.
bordercolor="#000000"
Border colour.
width="100%"
Width.
height="50"
Height.
bgcolor="#FFFFFF"
Background colour.
background="URLHERE"
Background image.
cellspacing="2"
Padding outside cell.
cellpadding="2"
Padding inside cell.