html
  1. html-table-tag

HTML <table> Tag

  • The HTML <table> tag is used to create tabular data on a web page.
  • It allows you to define a table with rows and columns, and to specify properties for each table cell.

Syntax

The basic syntax for creating an HTML table is as follows:

<table>
  <tr>
    <th>Header 1</th>
    <th>Header 2</th>
  </tr>
  <tr>
    <td>Row 1, Cell 1</td>
    <td>Row 1, Cell 2</td>
  </tr>
  <tr>
    <td>Row 2, Cell 1</td>
    <td>Row 2, Cell 2</td>
  </tr>
</table>
  • The <table> tag identifies the start of the table.
  • The <tr> tag identifies the start of each table row.
  • The <th> tag defines a header cell in the first row of the table.
  • The <td> tag defines a standard cell in a table row.

Example

Here's an example of creating a table with three rows and three columns:

<table>
  <tr>
    <th></th>
    <th>Column 1</th>
    <th>Column 2</th>
  </tr>
  <tr>
    <th>Row 1</th>
    <td>1,1</td>
    <td>1,2</td>
  </tr>
  <tr>
    <th>Row 2</th>
    <td>2,1</td>
    <td>2,2</td>
  </tr>
</table>
Try Playground

Explanation

Here are some of the key elements of the HTML <table> tag:

  • The <th> tag is used to define the headers for each column of the table, and appears in the first row of the table.
  • The <td> tag is used to indicate a standard cell in the table, and appears in each subsequent row.
  • The <tr> tag is used to define each row of the table.
  • Empty <th> tags can be used to create multi-row table headers or to create cells without text.

Use

The HTML <table> tag is used to create tables of data on a web page. Tables are useful for presenting information in an organized way, such as data for comparison or for presenting lists.

Important Points

Here are some important points to consider when using the HTML <table> tag:

  • Tables should be used for tabular data, not for layout purposes.
  • Tables should include header cells (<th>) for accessibility purposes.
  • Tables can be styled using CSS to change the look and feel of the table.
  • HTML tables can be complex and difficult to maintain in large amounts of data.

Summary

The HTML <table> tag is a powerful tool for organizing and presenting data on a web page. By using <th> and <td> tags, developers can create tables for a variety of purposes, including comparisons, lists, and more. While HTML tables can be complex to maintain in large amounts of data, they are still an important part of web development and should be used when appropriate.

Published on: