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.

I use SEMRush for Keyword Research & Boost Organic Traffic. Do You?

Highly recommended SEM & SEO Tool for overview of Traffic, Keywords, Backlinks and more. You can search your competitors URL to analyze keywords & crush your competition.



Get Free Blogging Tips & Technology updates in your Email !!!

Subscribe via RSS feed

The following two tabs change content below.
Anil Kumar
IT Blogger Tips focus on Blogging Tips, SEO Tips, Social Media, SQL Tips, PL/SQL Tips, Oracle DBA, Linux/Unix, Latest Technology, How Tos and Technical Solutions. You can find us on Facebook | Twitter |
Find on Google+

Siteground SALE
60% OFF SiteGround WordPress Hosting – $3.95/month (Exclusive Offer !!!)