HTML Tables
Tables represent data with meaningful row and column relationships. Core elements include <table>, <tr>, <th>, and <td>. Additional structural elements include <caption>, <thead>, <tbody>, <tfoot>, and <colgroup>.
Accessible Data Table
<table>\n <caption>Developer Salaries</caption>\n <thead>\n <tr><th scope="col">Role</th><th scope="col">Salary</th></tr>\n </thead>\n <tbody>\n <tr><th scope="row">Frontend Developer</th><td>₹12 LPA</td></tr>\n <tr><th scope="row">Backend Developer</th><td>₹15 LPA</td></tr>\n </tbody>\n</table>💡 Header cells and scope attributes help assistive technologies understand table relationships.
Key Takeaways
- Use tables for data, not page layout.
- Use th for headers and scope when appropriate.
Knowledge Check
Which element represents a table header cell?