
<table>
<tr> <td>a</td> <td>b</td> </tr>
<tr> <td>c</td> <td>d</td> </tr>
<tr> <td>e</td> <td>f</td> </tr>
</table>
| a | b |
| c | d |
| e | f |
<table border height="60" width="200">
<tr> <td>a</td> <td>b</td> </tr>
<tr> <td>c</td> <td>d</td> </tr>
<tr> <td>e</td> <td>f</td> </tr>
</table>
| a | b |
| c | d |
| e | f |
heightで高さ指定。widthで幅指定。共に%で表記可能。
borderを指定しないと表が見えません。
セル結合
<table border>
<tr> <th colspan="2"> colspan="2"指定 </th> <td> 普通 </td> </tr>
<tr> <th><th>で見出し指定</th><td rowspan="2"> rowspan="2"指定 </td> <td> 普通 </td></tr>
<tr> <th> 見出し </th> <td> 普通 </td> </tr>
<tr> <td>普通</td> <td>普通</td> <td>普通</td> </tr>
</table>
| colspan="2"指定 | 普通 | |
|---|---|---|
| <th>で見出し指定 | rowspan="2"指定 | 普通 |
| 見出し | 普通 | |
| 普通 | 普通 | 普通 |
colspanで右のセルと結合。rowspanで下のセルと結合。
セルの幅指定
<table border>
<tr> <td width="20">a</td> <td width="20%">b</td> </tr>
<tr> <td height="40">c</td> <td>d</td> </tr>
<tr> <td height="10%">e</td> <td>f</td> </tr>
</table>
| a | b |
| c | d |
| e | f |
位置指定
<table border width="60%" height="40%">
<tr> <td align="right">a</td> <td valign="top">b</td> </tr>
<tr> <td align="center">c</td> <td valign="middle">d</td> </tr>
<tr> <td align="left">e</td> <td valign="bottom">f</td> </tr>
</table>
| a | b |
| c | d |
| e | f |
余白
<table border cellpadding="15">
<tr> <td>a</td> <td>b</td> </tr>
<tr> <td>c</td> <td>d</td> </tr>
<tr> <td>e</td> <td>f</td> </tr>
</table>
| a | b |
| c | d |
| e | f |
罫線の太さと影
<table border="5" cellspacing="13">
<tr> <td>a</td> <td>b</td> </tr>
<tr> <td>c</td> <td>d</td> </tr>
<tr> <td>e</td> <td>f</td> </tr>
</table>
| a | b |
| c | d |
| e | f |
色
<table border style="background:#337711">
<tr> <td>a</td> <td>b</td> </tr>
<tr> <td>c</td> <td>d</td> </tr>
<tr> <td>e</td> <td>f</td> </tr>
</table>
| a | b |
| c | d |
| e | f |
セルにも<td style="background:#337711">とすれば 個別に色を付けられます。