HTML TUTORIAL


HTML Tables

The HTML Tables are created with <table> tag. The tables are formed of rows and each row will have one or usually more that one data. The row of a table is defined with <tr> tag. The tr stands for table row. Within a row, there are data cells that are defined with <td> tag. The letter td stands for table data. Take a look at the following table example.

<table border="1">
<tr>
<td>Sl No </td>
<td>Name </td>
</tr>
<tr>

<td>1</td>
<td>Allan</td>
</tr>

<td>2</td>
<td>Nancy</td>
</tr>

</table>


If you open it in the browser, it will look like this

Sl No Name
1 Allan
2 Nancy


The Border Attribute

In the above example the table had a border attribute. If you omit the border attribute, the border will not be printed.

<table >
<tr>
<td>Data1 </td>
<td>Data2 </td>
</tr>
<tr>

<td>Data3</td>
<td>Data4</td>
</tr>
</table>


The above example will give output as follows

Data1 Data2
Data3 Data4


Table Heading

The Table headings are defined with <th> tags. The th stands for table heading. Take a look at the following example

<table  border = "1" >

<tr>
<th>Sl No </th>
<th>Name </th>
</tr>

<tr>
<td>1 </td>
<td>Allan </td>
</tr>
<tr>

<td>2</td>
<td>Nancy</td>
</tr>
</table>


The above example will give output as follows

Sl No Name
1 Allan
2 Nancy




Practice Examples

You will like to practice more about links here.

Example - Table

Example - Table Without Border

Example -Table Heading

Example -Table with a bakground color

Example -Table with a Cell color

Example -Table with a bakground image

Example -Table with a backgrounf Cell image

Example -How to span cells in two columns

Example -How to span cells in two rows

Example -How to increase cell spacing

Example -How to increase cell span - cell padding