HTML Tables

To create tables in HTML, you use the table tag, <table></table>. Within the table tag, there are three more tags you should know about. The hr, th, and td tags respectively, <tr></tr>, <th></th>, and <td></td>. The tr tag refers to the table row. The th tag refers to the table header. The td tag refers to the table data. When creating a table, you embed the th and td tags within a tr tag. Below is how you would write out the table tag in HTML code and how it would be outputted in the browser.

Table in HTML

Code:

<table>
    <tr>
        <th>Name</th>
        <th>Age</th>
        <th>Favorite Color</th>
    </tr>
    <tr>
        <td>Sally</td>
        <td>15</td>
        <td>Purple</td>
    <tr>
        <td>Bob</td>
        <td>11</td>
        <td>Blue</td>
    <tr>
        <td>George</td>
        <td>18</td>
        <td>Red</td>
    </tr>
</table>

Output:

Name
Age
Favorite Color
Sally
15
Purple
Bob
11
Blue
George
18
Red

Note: To get this specific output, you have to include some styling to the table to have the table itself centered, the text within the table centered, and the border of the table to look like cells.