HTMLで表を作るときは以下のタグの組合せによって表現する。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<HTML>
<HEAD>
<TITLE>Sample of Table</TITLE>>
</HEAD>
<TABLE>
<TR>
<TH> 番号</TH> <TH> 名前</TH>
</TR>
<TR>
<TD> 97AD0000</TD> <TD> 阿部</TD>
</TR>
<TR>
<TD> 97AD0001</TD> <TD> 安部</TD>
</TR>
</TABLE>
</BODY>
</HTML>
この表を表示するとこのようになる。
このままでは見にくいのでCSSを使ってデザインを変えてみよう。
以下のファイルをtable-sample.cssという名前で作る。
TH {
background-color: blue;
color: white;
}
TD {
background-color: green;
color: white;
}
これを上のHTMLデータの<HEAD>タグの中で<LINK>タグによって読み込んでやる。
<HTML>
<HEAD>
<TITLE>Sample of Table</TITLE>>
<LINK REL = "stylesheet" TYPE = "text/css" HREF = "table-sample.css">
</HEAD>
<BODY>
.
.
.
</BODY>
</HTML>
するとこのようになる。