HTML TUTORIALS - HTML Tables
HTML Tables
ADVERTISEMENTS
Example:
<table border="1">
<tr>
<td>Row 1, Column 1</td>
<td>Row 1, Column 2</td>
</tr>
<tr>
<td>Row 2, Column 1</td>
<td>Row 2, Column 2</td>
</tr>
</table>
|
ADVERTISEMENTS
Row 1, Column 1 |
Row 1, Column 2 |
Row 2, Column 1 |
Row 2, Column 2 |
|
ADVERTISEMENTS
<table border="1">
<tr>
<th>Name</th>
<th>Salary</th>
</tr>
<tr>
<td>Ramesh Raman</td>
<td>5000</td>
</tr>
<tr>
<td>Shabbir Hussein</td>
<td>7000</td>
</tr>
</table>
|
Name |
Salary |
Ramesh Raman |
5000 |
Shabbir Hussein |
7000 |
|
<table border="1" cellpadding="5" cellspacing="5">
<tr>
<th>Name</th>
<th>Salary</th>
</tr>
<tr>
<td>Ramesh Raman</td>
<td>5000</td>
</tr>
<tr>
<td>Shabbir Hussein</td>
<td>7000</td>
</tr>
</table>
|
Name |
Salary |
Ramesh Raman |
5000 |
Shabbir Hussein |
7000 |
|
<table border="1">
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>Column 3</th>
</tr>
<tr><td rowspan="2">Row 1 Cell 1</td>
<td>Row 1 Cell 2</td><td>Row 1 Cell 3</td></tr>
<tr><td>Row 2 Cell 2</td><td>Row 2 Cell 3</td></tr>
<tr><td colspan="3">Row 3 Cell 1</td></tr>
</table>
|
Column 1 |
Column 2 |
Column 3 |
Row 1 Cell 1 |
Row 1 Cell 2 | Row 1 Cell 3 |
Row 2 Cell 2 | Row 2 Cell 3 |
Row 3 Cell 1 |
|
<table border="5" bordercolor="green" bgcolor="gray">
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>Column 3</th>
</tr>
<tr><td rowspan="2">Row 1 Cell 1</td>
<td bgcolor="red">Row 1 Cell 2</td><td>Row 1 Cell 3</td></tr>
<tr><td>Row 2 Cell 2</td><td>Row 2 Cell 3</td></tr>
<tr><td colspan="3">Row 3 Cell 1</td></tr>
</table>
|
Column 1 |
Column 2 |
Column 3 |
Row 1 Cell 1 |
Row 1 Cell 2 | Row 1 Cell 3 |
Row 2 Cell 2 | Row 2 Cell 3 |
Row 3 Cell 1 |
|
<table border="1" background="/images/home.gif">
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>Column 3</th>
</tr>
<tr><td rowspan="2">Row 1 Cell 1</td>
<td bgcolor="red">Row 1 Cell 2</td><td>Row 1 Cell 3</td></tr>
<tr><td>Row 2 Cell 2</td><td>Row 2 Cell 3</td></tr>
<tr><td colspan="3" background="/images/pattern1.gif">
Row 3 Cell 1
</td></tr>
</table>
|
Column 1 |
Column 2 |
Column 3 |
Row 1 Cell 1 |
Row 1 Cell 2 | Row 1 Cell 3 |
Row 2 Cell 2 | Row 2 Cell 3 |
Row 3 Cell 1 |
|
<table border="1" width="400" height="150">
<tr>
<td>Row 1, Column 1</td>
<td>Row 1, Column 2</td>
</tr>
<tr>
<td>Row 2, Column 1</td>
<td>Row 2, Column 2</td>
</tr>
</table>
|
Row 1, Column 1 |
Row 1, Column 2 |
Row 2, Column 1 |
Row 2, Column 2 |
|
<table border="1">
<caption>This is the caption</caption>
<tr>
<td>row 1, column 1</td><td>row 1, columnn 2</td>
</tr>
</table>
|
This is the caption
row 1, column 1 | row 1, columnn 2 |
|
<table border="1" width="100%">
<thead>
<tr>
<td colspan="4">This is the head of the table</td>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="4">This is the foot of the table</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
<td>Cell 4</td>
</tr>
<tr>
...more rows here containing four cells...
</tr>
</tbody>
<tbody>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
<td>Cell 4</td>
</tr>
<tr>
...more rows here containing four cells...
</tr>
</tbody>
</table>
|
This is the head of the table |
This is the foot of the table |
Cell 1 |
Cell 2 |
Cell 3 |
Cell 4 |
...more rows here containing four cells...
|
Cell 1 |
Cell 2 |
Cell 3 |
Cell 4 |
...more rows here containing four cells...
|
|
<table border="1">
<tr>
<td>
<table border="1">
<tr>
<th>Name</th>
<th>Salary</th>
</tr>
<tr>
<td>Ramesh Raman</td>
<td>5000</td>
</tr>
<tr>
<td>Shabbir Hussein</td>
<td>7000</td>
</tr>
</table>
</td>
<td>
<ul>
<li>This is another cell</li>
<li>Using list inside this cell</li>
</ul>
</td>
</tr>
<tr>
<td>Row 2, Column 1</td>
<td>Row 2, Column 2</td>
</tr>
</table>
|
Name |
Salary |
Ramesh Raman |
5000 |
Shabbir Hussein |
7000 |
|
- This is another cell
- Using list inside this cell
|
Row 2, Column 1 |
Row 2, Column 2 |
|