HTML Table | Table Tag Example

HTML Table

HTML Tables are used to arranging the data into the row and column formate. In other word HTML Table create the tabular form of data.

HTML Table structure consists 3 tags that is <table>, <tr> and <td>. Where <table> tag is the starting tag, <tr> tag defines the table row and <td> defines the table column.

Example 1 – HTML Table Tag Example

<html>
  <body>
    <table>
        <tr>
          <td>S. No.</td>
          <td>Name</td>
          <td>Marks</td>
        </tr>
        <tr>
          <td>1</td>
          <td>Monica</td>
          <td>88</td>
        </tr>
    </table>
  </body>
</html>

This is the syntax of the table where <tr> tag is used to create the row of table and <td> tag is used to insert the data in to the table row.

HTML Table Table in HTML
Fig.1 – HTML Table Or Table In HTML

Caution: If you want to add style to the heading of the table a new tag i.e. <th> tag is used. Because it is not easily to add any style to the <td> tag.

Example 2 – HTML Table with th Tag

<html>
  <body>
    <table>
        <tr>
          <th>S. No.</th>
  	  <th>Name</th>
          <th>Marks</th>
        </tr>
        <tr>
          <td>1</td>
          <td>Monica</td>
          <td>88</td>
        </tr>
        <tr>
          <td>2</td>
          <td>Sonia</td>
          <td>70</td>
        </tr>
        <tr>
          <td>3</td>
          <td>Sheetal</td>
          <td>80</td>
        </tr>
    </table>
  </body>
</html>

This is the syntax of the table where <th> tag is used to insert the data in the first row. The content of the th tag is displayed in bold.

HTML Table With Heading
Fig.1 – HTML Table With Heading
You can leave a response, or trackback from your own site.
Leave a Reply to the article

Learning & Certifications
Follow Us
Facebook Icon   Linked In Icon   Twitter Icon  
Validation and Recognition

Valid CSS! Valid HTML5!          Protected by Copyscape