Create tables in a HTML document

Tables are defined with the <table> tag. And HTML <table> tag is supported in all major browsers and it is very easy to implement in your HTML page.

A <table> tag is divided into rows <tr> and each row is divided into data cells <td>.

<table> : It defines a table

<th> : Defines a header cell in a table

<tr>: Defines a row in a table

<td>: Defines a cell in a table

Following example will show you how to use <table> tag, <th> tag, <tr> tag & <td> tag in your html document.

<html>
<head>
<title>Example of Table</title>
</head>
<body>
<center>
<table BORDER="1" BORDERCOLOR="#000033" CELLPADDING="1" CELLSPACING="1" WIDTH="80%" VALIGN="MIDDLE" ALIGN="CENTER">
<th WIDTH="100%" COLSPAN="4" BGCOLOR="#3399FF">Main Header</th>
<tr>
<td COLSPAN="4" HEIGHT="20" ALIGN="CENTER">Details of Students</td></tr>
<tr>
<td ALIGN="CENTER" BGCOLOR="#339933"><b>Branch</b></td>
<td ALIGN="CENTER" BGCOLOR="#339933"><B>Section</b></td>
<td ALIGN="CENTER" BGCOLOR="#339933"><b>Name</b></td>
<td ALIGN="CENTER" BGCOLOR="#339933"><b>Address</b></td></tr>
<tr>
<td ROWSPAN="4" WIDTH="25%"  ALIGN="CENTER" BGCOLOR="#FFFFCC">Computer Science</td>
<td ROWSPAN="3" WIDTH="25%" ALIGN="CENTER"  BGCOLOR="#FFFFCC">Section-1</td>
<td WIDTH="25%" ALIGN="CENTER"  BGCOLOR="#FFFFCC">Amit</td>
<td WIDTH="25%" ALIGN="CENTER"  BGCOLOR="#FFFFCC">Bikaner</td>
</tr>
<tr>
<td WIDTH="25%" ALIGN="CENTER" BGCOLOR="#FFFFCC">Sumit</td>
<td WIDTH="25%" ALIGN="CENTER" BGCOLOR="#FFFFCC">Gurgaon</td>
</tr>
<tr>
<td WIDTH="25%" ALIGN="CENTER" BGCOLOR="#FFFFCC">Ankit</td>
<td WIDTH="25%" ALIGN="CENTER" BGCOLOR="#FFFFCC">Allahabad</td>
</tr>
<tr>
<td WIDTH="25%" ALIGN="CENTER" BGCOLOR="#FFFFCC">Section-2</td>
<td WIDTH="25%" ALIGN="CENTER" BGCOLOR="#FFFFCC">Anjali</td>
<td WIDTH="25%" ALIGN="CENTER" BGCOLOR="#FFFFCC">Varanasi</td>
</tr>
</table>
</body>
</html>
The output of this HTML example is as follows:

create tables

With the help of above script, you can create any type of tables in HTML document.

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top
Scroll to Top