HTML Table | Table Tag Example

February 14th, 2019

Nilesh Chaurasia

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.