HTML表头
td
和 th
元素定义headers属性,可用于使用屏幕阅读器和其他技术更容易地处理表。
headers属性的值是一个或多个单元的ID属性值。
以下代码显示了如何使用此属性。
<!DOCTYPE HTML> <html> <head> <style> thead th, tfoot th { text-align: left; background: grey; color: white } tbody th { text-align: right; background: lightgrey; color: grey } thead [colspan], tfoot [colspan] { text-align: center; } </style> </head> <body> <table> <thead> <tr> <th id="rank">Rank</th> <th id="name">Name</th> <th id="color">Color</th> <th id="sizeAndVotes" colspan="2">Size & Votes</th> </tr> </thead> <tbody> <tr> <th id="first" headers="rank">Favorite:</th> <td headers="name first">XML</td> <td headers="color first">HTML</td> <td headers="sizeAndVote first">CSS</td> <td headers="sizeAndVote first">ABC</td> </tr> <tr> <th id="second" headers="rank">2nd Favorite:</th> <td headers="name second">Empty</td> <td headers="color second">XYZ</td> <td headers="sizeAndVote second">ABC</td> <td headers="sizeAndVote second">A</td> </tr> </tbody> <tfoot> <tr> <th colspan="5">© 2011 www.ancii.com Fruit Data Enterprises</th> </tr> </tfoot> </table> </body> </html>点击查看实例
全局id
属性被添加到tbody
中的thead
和th元素中的th
个元素。
对于 tbody
中的每个 td
和 th
headers属性将单元格与列标题相关联。