将文本悬停在表格标题单元格中答案

【问题标题】：Hover text in table heading cell将文本悬停在表格标题单元格中
【发布时间】：2014-03-21 14:53:06
【问题描述】：

是否有一种语义正确的方式在表格标题单元格中显示工具提示来解释有关列数据的某些内容？

我的桌子是这样的：

---------------------
| URL   | Pageviews |
---------------------
| url/1 |  5 / 20   |
---------------------
| url/2 |  2 / 14   |
---------------------

我希望“Pageviews”文本有一个工具提示，上面写着“Week / Total”（解释为什么数据看起来像这样）。

abbr 是否适合我使用？（它看起来像这样：<th><abbr title="Week / Total">Pageviews</abbr></th> 我似乎找不到更好的。定义说它应该用于缩写，这不是我的情况。

【问题讨论】：

为什么不直接在th上使用title属性呢？
@j08691 我想稍后设置它的样式，也许让它（abbr 元素）在右侧显示一个问号图标（类似于 padding-right 和 background CSS）。

标签： html semantics user-experience abbr

【解决方案1】：

HTML5 允许您在任何元素上使用“title”属性。 http://dev.w3.org/html5/alt-techniques/ 是对这些技术的一个很好的总结。

<th title="Week"> Pageviews </th>

我强烈建议在表格下方添加一个<caption/>，以用于可用性和用户体验目的！

【讨论】：