<th abbr=""></th>

更新日
仕様 HTML Living Standard
分類 ---
利用場所 tr要素の子要素として
内容 フロー・コンテンツ(ただし、header要素footer要素セクショニング・コンテンツヘッディング・コンテンツは含められない)

th要素abbr="" を追加すると、見出しテキストの省略形を指定することができます。

  • この属性で示された情報は、非視覚系のブラウザ(音声ブラウザ等)で役立てられることになります。

<th abbr="省略形のテキスト">省略前のテキスト</th>

属性
任意属性
abbr="" 見出しテキストの省略形 テキスト 省略形のテキスト

見出しの省略形を指定した例

<table>
<tr>
<th abbr="氏名">会員の氏名(敬称略)</th>
<th abbr="所属">所属団体名</th>
<th abbr="所在地">所在地(都道府県)</th>
</tr>
<tr>
<td>山田 太郎</td>
<td>○○○研究会</td>
<td>東京都</td>
</tr>
<tr>
<td>山田 花子</td>
<td>△△△研究会</td>
<td>埼玉県</td>
</tr>
</table>

音声ブラウザの中には、データセルの内容を読み上げる際に、関連する見出しと共に読み上げるものがあるそうです。

そういったブラウザを利用している場合、上記の表は次のように読み上げられることが期待されます。

氏名:山田 太郎、 所属:○○○研究会、 所在地:東京都
氏名:山田 花子、 所属:△△△研究会、 所在地:埼玉県

省略形を指定しておかないと、見出しの長いテキストがそのまま読み上げられることになります。

会員の氏名(敬称略):山田 太郎、 所属団体名:○○○研究会、 所在地(都道府県):東京都
会員の氏名(敬称略):山田 花子、 所属団体名:△△△研究会、 所在地(都道府県):埼玉県

使用例

  • 以下の例では、次のスタイルシートを指定して表の境界線を表示しています。
-----
table, th, td {
border: 1px #000000 solid;
}
-----

<table>
<tr>
<th abbr="氏名">会員の氏名(敬称略)</th>
<th abbr="所属">所属団体名</th>
<th abbr="所在地">所在地(都道府県)</th>
</tr>
<tr>
<td>山田 太郎</td>
<td>○○○研究会</td>
<td>東京都</td>
</tr>
<tr>
<td>山田 花子</td>
<td>△△△研究会</td>
<td>埼玉県</td>
</tr>
</table>

表示例
会員の氏名(敬称略) 所属団体名 所在地(都道府県)
山田 太郎 ○○○研究会 東京都
山田 花子 △△△研究会 埼玉県