table要素
table要素は表を表現するための要素です。
caption要素、colgroup要素、thead要素、tfoot要素、tbody要素、tr要素を直接の子要素として持つことができます。
<table>
<tr>
<th>見出し1</th>
<th>見出し2</th>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
</table>
border属性
border属性に1を指定するとレイアウト目的でtable要素が利用されていないことを明示できます。
<table border="1">
<tr>
<th>見出し1</th>
<th>見出し2</th>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
</table>
table要素で利用するborder属性には1か空文字しか指定できませんが、0を指定することでレイアウトテーブルとして利用していることを示すことができます。同様にWAI-ARIAで定義されているrole=”presentation”を指定することでレイアウトテーブルであることを明示することができます。
<table role="presentation">
<tr>
<td>左上</td>
<th>右上</th>
</tr>
<tr>
<td>左下</td>
<td>右下</td>
</tr>
</table>
また、2014年2月4日にリリースされたW3Cの仕様では利用可能属性からborder属性は削除されていますが、border属性の利用方法は残ったままです。
sortable属性
現在策定中のHTML5.1ではsortable属性を指定することでソート可能なテーブルであることを明示できます。将来的にはこの属性の指定によりブラウザ側でソート機能が提供される可能性があります。
<table sortable="sortable">
<tr>
<th>見出し1</th>
<th>見出し2</th>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
</table>
参考URL
4.9.1 The table element - HTML5 -W3C
4.9.1 The table element - HTML5.1
登録日 : 2014年03月30日 最終更新日 : 2014年6月29日