Elements of HTML Table
Table Elements | Description |
---|---|
The <table> element defines the start and end of the table. It acts as a container for all the table-related elements. | |
The <tr> (table row) element defines a row within the table. Each <tr> tag represents a horizontal row of cells or data entries. | |
The <th> (table header) element defines header cells within a table row (<tr>). Header cells are typically used to label columns or rows in the table. They are usually bold and centered by default, providing emphasis on the content they represent. | |
The <td> (table data) element defines regular data cells within a table row (<tr>). Data cells contain actual data or information that is displayed in the table. Unlike <th> cells, <td> cells are not bold and are aligned to the left by default. | |
The <thead> element defines the header section of a table, containing header rows (<tr> with <th>). | |
The <tbody> element groups the main content of the table, containing rows (<tr>) with data cells (<td>). | |
The <tfoot> element defines the footer section of a table, usually containing summary rows or totals. | |
<colgroup> and <col> | The <colgroup> element allows you to group together and style columns in a table. Inside <colgroup>, you can use <col> elements to define specific column properties such as width, alignment, and styling. This provides more control over the appearance of columns across the table. |
The <caption> element provides a title or description for the entire table. It is placed immediately after the opening <table> tag and before any <tr> elements. |
Note: The <thead>, <tbody>, <tfoot> elements help to organize the table structure logically and are optional but recommended for clarity.
How to Create Table in HTML?
HTML tables are essential for organizing and displaying data in a structured format on web pages. Creating a table in HTML is a fundamental skill for web developers. It is used for product information, presenting data analytics, or designing a pricing comparison chart, etc. This article provides a step-by-step guide on how to create tables in HTML.
Table of Content
- Elements of HTML Table
- Table Structure
- Basic Syntax of HTML Table
- Adding Table Heading to Rows
- HTML Table with thead, tbody, and tfoot Elements