Learn HTML – Part 34 – th Tag – Table Header Cells
The HTML th tag is used to define a header cell in an HTML table.
Header cells usually contain column titles or row labels that describe the data in the table.
What is the th Tag?
The th tag stands for Table Header.
It is used inside a tr element to define header cells that describe the content of a table column or row.
Basic Syntax
<table>
<tr>
<th>Name</th>
<th>Age</th>
</tr>
</table>
Example – Table with Header Cells
<table border="1">
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>Alice</td>
<td>23</td>
</tr>
<tr>
<td>Bob</td>
<td>28</td>
</tr>
</table>
Output:
| Name | Age |
|---|---|
| Alice | 23 |
| Bob | 28 |
Difference Between th and td
| Tag | Purpose |
|---|---|
th | Defines a header cell |
td | Defines a data cell |
Default Behavior of th
Browsers usually display header cells differently from data cells:
- Text is bold
- Text is centered
- It describes the column or row
Example – Row Header
<table border="1">
<tr>
<th>Product</th>
<th>Price</th>
</tr>
<tr>
<th>Laptop</th>
<td>$900</td>
</tr>
</table>
Why Use the th Tag?
- Identifies column or row headings
- Improves accessibility for screen readers
- Helps search engines understand table structure
- Makes tables easier to read
The
thtag helps define meaningful headings for table data.
Common Mistakes Beginners Make
- Using
tdinstead ofthfor table headers - Not clearly labeling columns
- Mixing header cells and data cells incorrectly
Conclusion
The HTML th tag is used to define header cells in HTML tables.
It improves table readability and helps both users and search engines understand the structure of the data.
What’s Next?
Now that you understand the th tag, the next step is learning about the thead, tbody, and tfoot tags, which help organize tables into header, body, and footer sections.
Next: Learn HTML – Part 35 – thead, tbody, tfoot – Table Sections →
Series: Learn HTML Series
