Get Website Learn Coding Tech Story

HTML Examples



Html Tables


Tables are very useful to arrange in Html and they are used very frequently by almost all web developers. Tables are just like spreadsheets and they are made up of rows and columns.


The <table> tag use to defined table in Html. Html table divided into rows and each row is divided into data cells. Table rows are define by <tr> tag and data cells by <td>.


Border is the one of the important attribute of <table>, it will put border across all the cells. If we do not need a border then just use border="0".





<table> example

<table border = "0">


 <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>









Html Tables Heading


Table heading can be defined using <th> element. This tag will be put to replace <td> tag which is used to represent actual data. Normally it need to put on the top row of table as heading.





<th> example

<table border = "0">


 <tr>


   <th>Table Heading of column 1</th>


   <th>Table Heading of column 2</th>


 </tr>


 <tr>


   <td>Data of column 1</td>


   <td>Data of column 2</td>


 </tr>


</table>









Colspan Attribute


Colspan attribute use to merge two or more columns into a single column.





<th> example

<table border = "0">


 <tr>


   <td colspan = "2">Marge Column 1</td>


 </tr>


 <tr>


   <td>Row 2, Column 1</td>


   <td>Row 2, Column 2</td>


 </tr>


</table>









Rowspan Attribute


As like colspan attribute, rolspan attribute also use to merge two or more rows into a single row.





<th> example


<table border = "0">


 <tr>


   <td rolspan = "2">Marge Row 1</td>


   <td>Row 1, Column 2</td>


 </tr>


 <tr>


   <td>Row 2, Column 2</td>


 </tr>


</table>









Html Table Elements












































Tag Description
<table>Defines a table in Html document.
<th>Defines a cell as heading in a table.
<tr>Defines a row in a table.
<td>Defines a data cell in a table.
<caption>Defines a caption for table.
<colgroup>Defines a group of one or more columns in a table for formatting.
<col>Defines column properties for each column within a <colgroup> element.
<thead>Defines groups of header content in a table.
<tbody>Defines groups of body content in a table
<tfoot>Defines groups of footer content in a table.