テーブル(表)の基本的な構造は、
<TABLE>~</TABLE>内に
<TR>~</TR>で表の横一行を定義して、
さらにその中に<TH>~</TH>や<TD>~</TD>でセルを定義します。
<TD>はTable
Dataの略で、セルの内容が「データ」となるデータセルを作成します。
セルの内容が「見出し」の場合には、<TH>~</TH>を使用します。
■使用例
HTMLソース
<table border=”1″ width=”500″ cellspacing=”0″ cellpadding=”5″ bordercolor=”#333333″>
<tr>
<th bgcolor=”#EE0000″><font color=”#FFFFFF”>メニュー</font></th>
<th bgcolor=”#EE0000″ width=”150″><font color=”#FFFFFF”>説明</font></th>
<th bgcolor=”#EE0000″ width=”200″><font color=”#FFFFFF”>豆知識</font></th>
</tr>
<tr>
<td bgcolor=”#99CC00″ align=”right” nowrap>カルボナーラ</td>
<td bgcolor=”#FFFFFF” valign=”top” width=”150″>玉子とベーコンとクリームソースのパスタ</td>
<td bgcolor=”#FFFFFF” valign=”top” width=”200″>カルボナーラとは炭焼き職人という意味</td>
</tr>
<tr>
<td bgcolor=”#99CC00″ align=”right” nowrap>ペスカトーレ</td>
<td bgcolor=”#FFFFFF” valign=”top” width=”150″>エビとあさりの漁師風パスタ</td>
<td bgcolor=”#FFFFFF” valign=”top” width=”200″>ペスカトーレは漁師風という意味</td>
</tr>
</table>
ブラウザ上の表示
メニュー | 説明 | 豆知識 |
---|---|---|
カルボナーラ | 玉子とベーコンとクリームソースのパスタ | カルボナーラとは炭焼き職人という意味 |
ペスカトーレ | エビとあさりの漁師風パスタ | ペスカトーレは漁師風という意味 |