COE documents

table要素

行と列で区切られた表を作成できる．

tr要素

表の中で行を表す．

td要素

tr要素の中で表のセルを作成できる．

table要素に対する属性

border属性

表の周囲に表示される枠線の太さを指定できる．

テンプレート	<table border=" "> <tr><td> </td><td> </td><td> </td></tr> <tr><td> </td><td> </td><td> </td></tr> </table>
例文	<table border="1"> <tr><td>あ段</th><td>か段</th><td>さ段</th></tr> <tr> <td>あいうえお</td> <td>かきくけこ</td> <td>さしすせそ</td> </tr> </table>
出力	あ段 か段 さ段 あいうえお かきくけこ さしすせそ

cellspacing属性

立体感のない表

テンプレート	<table border=" " cellspacing=" "> <tr><td> </td><td> </td><td> </td></tr> <tr><td> </td><td> </td><td> </td></tr> </table>
例文	<table border="1" cellspacing="0"> <tr><td>あ</td><td>あ</td><td>あ</td></tr> <tr><td>か</td><td>か</td><td>か</td></tr> </table>
出力	あ あ あ か か か

cellpadding属性

テンプレート	<table border=" " cellpadding=" "> <tr><td> </td><td> </td><td> </td></tr> <tr><td> </td><td> </td><td> </td></tr> </table>
例文	<table border="1" cellpadding="8"> <tr><td>あ</td><td>あ</td><td>あ</td></tr> <tr><td>か</td><td>か</td><td>か</td></tr> </table>
出力	あ あ あ か か か

その他の属性

• frame属性
• rules属性
• width属性
• height属性
• background属性
• summary属性

tr要素に対する属性

tr要素の属性

• align属性
• valign属性
• char属性
• charoff属性

td要素およびth要素に対する属性

align属性

セル内での文字の横方向の配置を指定する．

valign属性

セル内での文字の縦方向の配置を指定する．

colspan属性

テンプレート	<table border=" "> <tr><td colspan="3"> </td></tr> <tr><td> </td><td> </td><td> </td></tr> </table>
例文	<table border="1"> <tr><td colspan="3">あ</td></tr> <tr><td>か</td><td>か</td><td>あ</td></tr> </table>
出力	あ か か あ

rowspan属性

テンプレート	<table border=" "> <tr><td rowspan="2"> </td><td> </td><td> </td></tr> <tr><td> </td><td> </td></tr> </table>
例文	<table border="1"> <tr><td rowspan="2">あ</td><td>あ</td><td>あ</td></tr> <tr><td>か</td><td>か</td></tr> </table>
出力	あ あ あ か か

tdおよびth要素に対するその他の属性

• background属性
• abbr属性
• axis属性
• headers属性
• scope属性
• char属性
• charoff属性

th要素

見出しの付いた表

<table border=" ">
<tr><th> </th><th> </th><th> </th></tr>
<tr><td> </td><td> </td><td> </td></tr>
</table>

<table border="1">
<tr><th>あ段</th><th>か段</th><th>さ段</th></tr>
<tr>
<td>あいうえお</td>
<td>かきくけこ</td>
<td>さしすせそ</td>
</tr>
</table>

表や図を並べる

<table>
<tr><td>
<table border="1">
<tr><th>あ段</th><th>か段</th><th>さ段</th></tr>
<tr>
<td>あいうえお</td>
<td>かきくけこ</td>
<td>さしすせそ</td>
</tr>
</table>
</td><td>
<table border="1">
<tr><th>あ段</th><th>か段</th><th>さ段</th></tr>
<tr>
<td>あいうえお</td>
<td>かきくけこ</td>
<td>さしすせそ</td>
</tr>
</table>
</td></tr>
</table>

caption要素

<table border=" ">
<caption> </caption>
<tr><th> </th><th> </th><th> </th></tr>
</table>

<table border="1">
<caption> あ段 </caption>
<tr><th>あ</th><th>あいうえお</th></tr>
</table>

セルのグループ分け

• thead要素
• tfoot要素
• tbody要素
• colgroup要素
• clo要素