Rediscovering HTML tables

Based on some of my recent practices and after communicating with some readers about the use of HTML tables, I decided to write this article. In general, I noticed that they have a preconceived aversion to the use of tables due to misleading information. In fact many people will say "I see that tables should never be used", but this is absolutely wrong! This suggestion only applies to using HTML tables to define the layout of a web page, but tables are perfect for conveniently arranging rows and columns of data information, and if you must display tabular data on a page, you have to use them! why not? However, in this case, some people ignore the existence of certain HTML tags for tables and don't know how to use them correctly.

HTML has 10 table-related tags. Below is a list with an introduction, but first, the document must be properly defined under HTML 4.01/XHTML 1 or HTML 5:

• <caption> defines the table title (4, 5)
• <col> defines attributes for table columns (4, 5)
• <colgroup> defines the grouping of table columns (4, 5)
• <table> defines table(4, 5)
• <tbody> defines the table body (4, 5)
• <td> defines a cell (4, 5)
• <tfoot> defines the footnote (bottom) of the table (4, 5)
• <th> defines the header of the table (4, 5)
• <thead> defines the header of the table (4, 5)
• <tr> defines the rows of the table (4, 5)

A basic table structure is as follows:

It contains a title, header, body, and footer. The correct order of HTML elements is:

1. <table>
2. <caption>
3. <thead>
4. <tfoot>
5. <tbody>

You can also use <col> and <colgroup> to define table columns or group columns:

1. <table>
2. <caption>
3. <colgroup>
4. <col>
5. <thead>
6. <tfoot>
7. <tbody>