HTML Tables

The HTML tables is used to show your datas, information, etc in an appropriate way.
A table is divided into rows (with the <tr> tag), and each row is divided into data cells (with the <td> tag). td stands for “table data,” and holds the content of a data cell. A <td> tag can contain text, links, images, lists, forms, other tables, etc.
To create table, <table> tag is used. An HTML table consists of one or more <tr>, <th> and <td> elements.

•  <tr> element defines a table row.
•  <th> element defines a table header.
•  <td> element defines a table cell.

A more complex HTML table may also include <caption>, <col>, <colgroup>, <thead>, <tfoot>, and <tbody> elements.

Attribute	Value	Description
align	left center right	Deprecated. Use styles instead. Specifies the alignment of a table according to surrounding text
bgcolor	rgb(x,x,x) #xxxxxx colorname	Deprecated. Use styles instead. Specifies the background color for a table
border	pixels	Specifies the width of the borders around a table
cellpadding	pixels	Specifies the space between the cell wall and the cell content
cellspacing	pixels	Specifies the space between cells
frame	void above below hsides lhs rhs vsides box border	Specifies which parts of the outside borders that should be visible
rules	none groups rows cols all	Specifies which parts of the inside borders that should be visible
summary	text	Specifies a summary of the content of a table
width	pixels %	Specifies the width of a table

HTML code:
<table border="1" align="center" width="200">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
Output:

HTML Table Headers code
<table border="1" width="200">
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
Output:

HTML Table Tags
 

Tag	Description
<table>	Creates a table
<th>	Defines a table header
<tr>	Defines a table row
<td>	Defines a table cell
<caption>	Defines a table caption
<colgroup>	Defines a group of columns in a table, for formatting
<col />	Defines attribute values for one or more columns in a table
<thead>	Groups the header content in a table
<tbody>	Groups the body content in a table
<tfoot>	Groups the footer content in a table

Table Colspan:
A colspan is used to merge two or more than two columns in a table.
HTML code:
<table align=”center” width=”200″ bgcolor=”#DADADA” border=”1″>
<tr>
<td colspan=2 align=”center”> Namaste</td>
</tr>
<tr>
<td> Column 1</td>
<td>Column 2</td>
</tr>
</table>
Output:

Table Rowspan:
A rowspan is used to merge two or more than two rows in a table.
HTML code:
<table align="center" width="300" bgcolor="#8CC6FF" border="1">
<tr>
<td rowspan="2"> Namaste</td>                                                                                                                               <td> Column 1</td>
</tr>
<tr>
<td> Column 1</td>
</tr>
</table>
Output: