HTML Table

Table tag < table;> are used to define html tables. Different data (i.e, text, images and paragraph) can be added in data cell. A table consist of two tags, it is divided into rows (with the < tr> tag) and each row is divided into data cells (with the < td> tag). The table can be used for defining a layout and divided web page into different section like header, footer, right and left column main center and so on.

The Basic Structure Of An HTML Table

View Of The Table in Browser

row A	row A
row B	row B

A heading are define in a table with < th> tag

<table border="1">
<tr>
<th>Heading A</th>
<th> Heading B</th>
</tr>
<tr>
<td>row A</td>
<td>row B</td>
</tr>
<tr>
<td>row A</td>
<td>row B cell 2</td>
</tr>
</table>

View of the Table in Browser

Heading A Heading B

row A row B

row A row B

Empty data cell

<table border="1">
<tr>
<td>row A</td>
<td>row A</td>
</tr>
<tr>
<td>row B</td>
<td> </td>
</tr>
</table>

View of the Table in Browser

row A row A

row B

Some Important Attributes

1. border= “value”

To display a table with borders, you will have to use the border attribute like < table border = “1”>

2.align = “center”

You only need to include this attribute when you want to center the table in your webpage like < table align = “center”>.

3.width = “value” height = “value”

These two attributes define a table’s width and height, either with an absolute value in pixels or a relative value percentage

(i)Pixel
<table align = “center” border = “2” width = “500” height = “200” >.
(ii)Percentage
<table align = “center” border = “2” width = “5%” height = “2%” >.
4. cellpadding = “value” cellspacing = “value”

The attribute cellpandding defines the space in pixels between a table cells border and its content while the attribute callspacing describes the space in pixels between the different table calls. These spaces are always equally applied to all four sides like < table align = “center” border = “5” width = “500” height =”200” cellpadding = “100” cellspacing = “20”>.