<th axis=""></th>
ブラウザ | 非視覚系のブラウザ向け |
---|---|
分類 | --- |
要素 |
th要素やtd要素に axis=""
を追加すると、セルの分類を指定することができます。
この属性で示された情報は、音声ブラウザなどで役立てられることになります。
<th axis="分類名">見出しセル</th>
属性 | 値 | 説明 |
---|---|---|
axis="" |
文字列 | セルの分類名を指定 |
- axis属性の値(分類名)は、カンマ(
,
)区切りで複数指定することができます。
この属性を見出しのセルに指定することで、その見出しがどの分類に属しているのかを示すことができます。
以下の使用例では、食費 ホテル代 交通費が支出に、東京 横浜が場所に、10月5日や10月6日などが日付に分類されていることを示しています。
使用例
<table border="3">
<tr>
<th></th>
<th scope="col" axis="支出">食費</th>
<th scope="col" axis="支出">ホテル代</th>
<th scope="col" axis="支出">交通費</th>
</tr>
<tr>
<th id="s1" axis="場所">東京</th>
<th></th>
<th></th>
<th></th>
</tr>
<tr>
<td headers="s1" scope="row" axis="日付">10月5日</td>
<td headers="s1">3,000円</td>
<td headers="s1">12,000円</td>
<td headers="s1">1,200円</td>
</tr>
<tr>
<td headers="s1" scope="row" axis="日付">10月6日</td>
<td headers="s1">4,500円</td>
<td headers="s1">12,000円</td>
<td headers="s1">1,500円</td>
</tr>
<tr>
<th id="s2" axis="場所">横浜</th>
<th></th>
<th></th>
<th></th>
</tr>
<tr>
<td headers="s2" scope="row" axis="日付">10月7日</td>
<td headers="s2">2,800円</td>
<td headers="s2">10,000円</td>
<td headers="s2">2,200円</td>
</tr>
<tr>
<td headers="s2" scope="row" axis="日付">10月8日</td>
<td headers="s2">3,800円</td>
<td headers="s2">10,000円</td>
<td headers="s2">1,800円</td>
</tr>
</table>
- 表示例
-
食費 ホテル代 交通費 東京 10月5日 3,000円 12,000円 1,200円 10月6日 4,500円 12,000円 1,500円 横浜 10月7日 2,800円 10,000円 2,200円 10月8日 3,800円 10,000円 1,800円