Tables in HTML

HTML tables are used to organize and display data in a tabular format on a webpage.

They are defined using the <table> tag, and within it, the rows are defined using the <tr> (table row) tag.

Table headers are defined with the <th> (table header) tag, and table data cells are defined with the <td> (table data) tag.


Here is a basic example of an HTML table:

<table border="1">
    <tr>
        <th>Name</th>
        <th>Age</th>
        <th>City</th>
    </tr>
    <tr>
        <td>John Doe</td>
        <td>30</td>
        <td>New York</td>
    </tr>
    <tr>
        <td>Jane Smith</td>
        <td>25</td>
        <td>Los Angeles</td>
    </tr>
    <tr>
        <td>Mike Johnson</td>
        <td>40</td>
        <td>Chicago</td>
    </tr>
</table>

In this example:

  1. The <table> tag defines the start and end of the table.
  2. The border="1" attribute adds a border to the table cells.
  3. The first <tr> tag creates a row with three header cells (<th>) for "Name," "Age," and "City."
  4. Subsequent <tr> tags create rows with data cells (<td>), each containing data for the respective headers.

When rendered in a browser, this code will display a table with three columns ("Name," "Age," "City") and three rows of data.