<table>
Element: Introduction to tables for displaying tabular data. Table rows (<tr>
), table headers (<th>
), and table data (<td>
): Components of a table structure. Table attributes for controlling layout, borders, and accessibility features.
-
Definition:
Tables (<table>
) are used to display tabular data in rows and columns. They consist of table rows (<tr>
), table headers (<th>
), and table data (<td>
). -
Element Type:
Block-level -
Why Use This:
Tables are an effective way to organize and present complex data sets in a systematic and easy-to-understand format. They provide a visual representation of information and facilitate comparison between different data points. -
Available Resources:
- Tabular data
-
Recommendation:
Use tables to present data in a structured format, such as schedules, product listings, or financial data. Ensure tables are accessible and provide appropriate column headers (<th>
) for screen reader users. Avoid using tables for layout purposes, as it may lead to accessibility issues and hinder responsive design. -
Example:
<table border="1">
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Data 1</td>
<td>Data 2</td>
</tr>
</table>
- Explanation:
- The
<table>
element is used to create tables for displaying tabular data. - Table rows (
<tr>
), table headers (<th>
), and table data (<td>
) define the structure and content of the table. - Attributes like
border
can be used to control the appearance of the table (though styling with CSS is generally preferred).
- The
These examples demonstrate the basic usage and functionality of each HTML element within the context of a web page.