HTML - Table

A table is simply a combination of rows and columns.table are defined with the <table> tag and its related tags to make an attractive web page.

A table is divided into rows and each row id divided into data cells.the letters td stands table data,which is the content of a data cell.a data cell can contain text,images,lists,paragraphs,forms,horizontal rules,etc.

The create a table used <table>...</table> element is used to create a new table.the following list of table tag attributes.

Table Tag Attributes


Attributes

Description

border

it is used to specify the thickness of the border of table.

bordercolor

it is used to specify the color of all the border of table.

bordercolorlight/dark

it is used to specify the left-top /right-bottom border color of table.

align

it is used to specify to which side the table is to be displayed like left,right,center.

height and width

The height of a table can be specified with height attribute and width of an attribute can be specified with width attribute.

bgcolor

it is used to specify the background color of the table.

background

this attribute is used to insert image in table background.

cellspacing

it used to specify the space between the adjacent cells.

cellpadding

it is used to put some space around the text within a cell.


<tr>...</tr>

Table row defines a horizontal row that consists of table data cells.this tag has its own attributes as folloes.


Attributes

Description

align

This attribute is useful to decide the content of row either left right or center side of the cell.

valign

this attribute is useful to decide the content of cell to placed on top,bottom or middle of the cell.

height and width

it is used to specify the size of individual cell.there also the value can be in percentage or pixels.

bgcolor

it is used to specify the background color of the row.


<td>...</td>

It defines a cell.table data contained within these tags.you can also nest addition tables within a single cell.you can optionally leave off the closing <td> tag.thistag has also some attributes.they are same as table header tag <th>

<th>...</th>

Table header tag are used to define headers,usually in the first row or column of the table .you can optionally leave off the closing <th> tag.


Attributes

Description

align

This attribute is useful to put heading in cell on either left,right or center.

valign

This attribute is useful to decide the content of cell to placed on top,bottom or middle of the cell.

height and width

Used to specify the size of individual cell.there also the value can be in percentage or in pixels.

bgcolor

Used to specify the background color of the call heading.

colspan

This attribute is used to join two or more than two columns.its value is given in integer.

rowspan

This attribute is used to join two or more than two rows.its value is given in integer.


Example of Table


<html>
<head>
	<title>HTML - Table>/title>
</head>
<body>
<table border="2" height="400px" width="500px">
<tr>
<td>Item No.</td>
<td>Item Name</td>
<td>Item qty.</td>
</tr>
<tr>
<td>01</td>
<td>Mouse</td>
<td>10</td>
</tr>
<tr>
<td>02</td>
<td>Keyboard</td>
<td>10</td>
</tr>
<tr>
<td>03</td>
<td>Monitor</td>
<td>5</td>
</tr>
</table>
</body>
</html>
							

Output on Webpage


Item No. Item Name Item qty.
01 Mouse 10
02 Keyboard 10
03 Monitor 5
Share Share on Facebook Share on Twitter Share on Google+ Share on LinkedIn Pin on Pinterest Share on Stumbleupon Share on Tumblr Share on Reddit Share on Diggit