HTML Tutorials

HTML Tables

The tables are definied with the table tag <table>. Each table contains rows <tr> and each row contains cells <td>. This is a simple table structure with 1 row and 2 columns.

<table border="1">
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
</tr>
</table>
The table will look like that:

Cell 1

Cell 2

You can add the following atributes to the table tag:

<table cellpadding="2" cellspacing="2">

cellpadding - this is the distance between the content (text, image) in the cell and the end (wall) of the cell. The cellpadding is measured in pixels.

cellspacing - this is the distance between cells and rows, it is measured in pixels as well.

bgcolor - Each row or/and cell can accept bgcolor="#CCCCCC", this is the color of the row or the cell.

Follow the next sample

<table border="0" cellpadding="4" cellspacing="1" bgcolor="#000000" width="300">
<tr>
<td bgcolor="#CCCCCC" width="200">Cell 1</td>
<td bgcolor="#FFFF00" width="100">Cell 2</td>
</tr>
</table>

Cell 1

Cell 2

width - this is the Width of a Table, Row, Cell. In this case the table has 300 (pixels) width and the cells are with 200 pixels and 100 pixels width.

Back