HTML Tables | Learn How to Create Structured Data Tables

HTML Tables

HTML tables are a way to display data in a structured, organized format. A table consists of rows and columns, with cells at each intersection. Tables can be used for a variety of purposes, such as displaying financial data, schedules, or product listings.

To create a table in HTML, you use the <table> tag. Within the <table> tag, you define the rows using the <tr> tag and the cells using the <td> tag.

As an example:

Editor

Loading...

HTML Table Cells

Table cells are defined using the <td> (table data) element. Each <td> element represents a single cell in the table. The content of the cell can be added between the opening and closing tags of the <td> element.

As an example:

Here's a simple HTML table with two rows and two columns.

<table>
  <tr>
    <td>Row 1, Column 1</td>
    <td>Row 1, Column 2</td>
  </tr>
  <tr>
    <td>Row 2, Column 1</td>
    <td>Row 2, Column 2</td>
  </tr>
</table>

Table Rows

Table rows are defined using the <tr> (table row) element. Each <tr> element represents a single row in the table.

As an example:

Here is a simple HTML table with two rows and two columns.

<table>
  <tr>
    <td>Row 1, Column 1</td>
    <td>Row 1, Column 2</td>
  </tr>
  <tr>
    <td>Row 2, Column 1</td>
    <td>Row 2, Column 2</td>
  </tr>
</table>

HTML Table Headers

Table headers are defined using the <th> (table header) element. Each <th> element represents a header cell in the table.

As an example:

Here is a simple HTML table with a header row and two data rows.

<table>
  <tr>
    <th>Header 1</th>
    <th>Header 2</th>
  </tr>
  <tr>
    <td>Data 1, Column 1</td>
    <td>Data 1, Column 2</td>
  </tr>
  <tr>
    <td>Data 2, Column 1</td>
    <td>Data 2, Column 2</td>
  </tr>
</table>