<caption> HTML element is used to provide a title or caption for a table. It is typically placed immediately after the opening
<table> tag and before the first
<tr> (table row) in the table structure.
Here’s an example of how to use the
<table> <caption> Monthly Sales Report </caption> <tr> <th>Product</th> <th>Units Sold</th> <th>Revenue</th> </tr> <tr> <td>Product A</td> <td>100</td> <td>$5,000</td> </tr> <tr> <td>Product B</td> <td>75</td> <td>$3,750</td> </tr> </table>
In this example, the
<caption> element is used to provide a title for the table, indicating that it represents a “Monthly Sales Report”. The caption is typically displayed above the table, providing a clear and concise description of the table’s purpose or content.
<caption> element is a semantic element that enhances the accessibility and understanding of the table’s structure and content. It serves as a way to summarize or describe the data presented in the table and helps users navigate and interpret the information effectively.
You can style the
<caption> element using CSS to change its appearance, such as adjusting the font size, color, alignment, or adding background colors or borders.
It’s important to note that the
<caption> element should be used judiciously and only for tables that benefit from a clear title or caption. In some cases, a table may not require a caption if the table’s structure and content are self-explanatory.
In summary, the
<caption> element is used to provide a title or caption for a table. It enhances the accessibility and clarity of the table’s content, making it easier for users to understand the purpose or context of the table.