top>HTMLタグ辞典>テーブル(表)のボディ部分を定義する

<TBODY>

テーブル(表)のボディ部分を定義する

テーブル<TABLE>の行はその機能により、ヘッダ<HEAD>〜</HEAD>・ボディ<TBODY>〜</TBODY>、フッタ<TFOOT>〜</TFOOT>に分けられます。

ソース中では、<THEAD>〜<THEAD>→<TBODY>〜<TBODY>→<TFOOT>〜<TFOOT>の順序で記述するよう定義されています。これはヘッダとフッタを先読みして表示する為ですが、これらのタグに対応していない Netscape Navigator(ネットスケープナビゲータ)4等は、そのままフッタをボディより上に表示してしまうので注意です。

ソース

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>タイトル</title>
</head>
<body>
<table border="1" width="300" cellspacing="0" cellpadding="5" bordercolor="#333333">
<thead>
<tr bgcolor="#000000">
<th><font color="#FFFFFF">製品名</font></th>
<th width="150"><font color="#FFFFFF">説明</font></th>
<th width="200"><font color="#FFFFFF">価格</font></th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="3" bgcolor="#CCCCCC" align="right">商品仕様</td>
</tr>
</tfoot>
<tbody>
<tr>
<td bgcolor="#99CC00" align="right" nowrap>商品A</td>
<td bgcolor="#FFFFFF" valign="top" width="150">商品Bより頑丈である</td>
<td bgcolor="#FFFFFF" valign="top" width="200">800円</td>
</tr>
<tr>
<td bgcolor="#99CC00" align="right" nowrap>商品B</td>
<td bgcolor="#FFFFFF" valign="top" width="150">商品Aよりしなやかである</td>
<td bgcolor="#FFFFFF" valign="top" width="200">600円</td>
</tr>
</tbody>
</table>
</body>
</html>

 

対応ブラウザ

  • NetscapeNS3・・・×
  • NetscapeNS4・・・×
  • NetscapeNS6・・・○
  • NetscapeNS7・・・○
  • IEIE3・・・○
  • IEIE4・・・○
  • IEIE5・・・○
  • IEIE5.5・・・○
  • IEIE6・・・○
  • OperaO6・・・○
  • OperaO7・・・○
  • FirefoxFX1・・・○

更新履歴

2008.8.7
linkページのリンクに、リンク先のサイトサムネイルを表示させるようにしました。
PORTFOLIOのページもサムネイルをクリックすることにより、画像を拡大して表示するようにしました。
2008.7.4
linkに3件追加
2008.6.22
Portfolioに1件追加
サイトデザイン修正
2008.6.17
linkに1件追加
2008.1.19
Portfolioに1点追加
2008.1.16
Portfolioに2点追加
2007.9.29
BLOG開始
2007.8.6
HTMLに一件追加
2007.8.3
サイトリニューアル
2007.6.19
Portfolioに1点追加
2006.9.13
Portfolioに1点追加
2006.8.11
Portfolioに1点追加
2006.8.11
Blog更新、BBS削除しました、LINKに1件追加

DARKNESS

このサイトへのリンクはフリーです。ご連絡していただければ相互リンクもいたします。リンクの際は下記バナをご利用ください。

DARKNESS BANA 31×31
31×31px
DARKNESS BANA 88×31
88×31px
DARKNESS BANA
188×29px