HTML Tutorial | Table


In HTML, <table> tag is used to define tables on web page.

  • Table is divided into Rows and Columns.
  • A Row is define by <tr> tag
  • Row is divided into number of columns.
  • Column contains table data which are define by <th> tag and <td> tag.
  • <th> tag is used to define table heading.
  • <td> tag is used to define table data.
Example:
   <table>
   <tr>
   <th>S.No</th>
   <th>Courses</th>
   </tr>
   <tr>
   <td>1</td>
   <td>HTML</td>
   </tr>
   <tr>
   <td>2</td>
   <td>CSS</td>
   </tr>
   </table>

Border attribute

The border attribute specifies an border of a table.

Example:
   <table border="1">
   <tr>
   <th>S.No</th>
   <th>Courses</th>
   </tr>
   <tr>
   <td>1</td>
   <td>HTML</td>
   </tr>
   <tr>
   <td>2</td>
   <td>CSS</td>
   </tr>
   </table>

Colspan attribute

To make a cell span (extend over an area) more than one column, use the colspan attribute.

Example:
   <table border="1">
   <tr>
   <th>S.No</th>
   <th colspan="2">Phone No.</th>
   </tr>
   <tr>
   <td>1</td>
   <td>+91 1234567898</td>
   <td>+91 1234567897</td>
   </tr>
   <tr>
   <td>2</td>
   <td>+91 1234567896</td>
   <td>+91 1234567894</td>
   </tr>
   </table>
	   

Rowspan attribute

To make a cell span (extend over an area) more than one row, use the rowspan attribute.

Example:
   <table border="1">
   <tr>
   <th>Name</th>
   <td>Ashwani Bansal</td>
   </tr>
   <tr>
   <th rowspan="3">Telephone</th>
   <td>+91 1234567898</td>
   </tr>
   <tr>
   <td>+91 1234567896</td>
   </tr>
   <tr>
   <td>+91 1234567894</td>
   </tr>
   </table>
	   

Table Caption

To add a caption (summary of table) to a table, use the <caption> tag.

  • The <caption> tag must be inserted immediately after the <table> tag.
Example:
   <table border="1">
   <caption>Telephone Numbers</caption>
   <tr>
   <th>Name</th>
   <td>Ashwani Bansal</td>
   </tr>
   <tr>
   <th rowspan="3">Telephone</th>
   <td>+91 1234567898</td>
   </tr>
   <tr>
   <td>+91 1234567896</td>
   </tr>
   <tr>
   <td>+91 1234567894</td>
   </tr>
   </table>
	   


Video-English
Best Use:360p or more (480p or 720p)



Video-Hindi
Best Use:360p or more (480p or 720p)