XHTMLとCSSによるhtml作成：tableタグの正しい定義
JavaScript・XHTML・CSS (43 items)
2004年07月03日
以前は、レイアウト調整をtableタグで行うことが通例であった。
しかし、
昨今の”SEO対策”・”W3C準拠”・”ブラウザの標準統一”の言葉と共に、
「XHTML」によるhtml作成が標準となりつつあり、
tableタグに関しては、レイアウト調整では使わず、
本当に必要と思われる場合のみ、使う事が望ましい。
そこで、正しいtableタグ定義を改めて考えてみる。
<table>
<caption>T CAPTION</caption>
<thead>
<tr>
<th>T HEAD</th>
<th>(A)</th>
</tr>
</thead>
<tfoot>
<tr>
<th>T FOOT</th>
<td>13,782</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>T BODY</td>
<td>2,230</td>
</tr>
</tbody>
</table>
今までは、
table・tr・tdタグだけで構造定義する事が多く見受けられたが、
実際は上記ソースのようなタグを使用することになる。
<caption>タグ
・・・テーブル見出し
<thead>タグ
・・・テーブルヘッダ
<tfoot>タグ
・・・テーブルフッタ
<tbody>タグ
・・・テーブルボディ
<th>タグ
・・・テーブルヘッダ部分のセル（テーブルフッタの先頭セルにも記述）
上記タグは、それぞれ省略可能であるが、
どのタグが省略可能かは、以下のファイルで動作確認してみた。
（動作確認環境）
OS：WinXP
ブラウザ：IE6.0、Mozilla 1.7、Opera7.23
※XHTML1.1についての動作確認。
＞＞動作確認結果のダウンロード＜＜
この記事に関連した過去記事一覧は画面下にあります。
Comments
コメントは、まだ書かれていません
Add Comments
Trackback
ネットビジネス用CGI Perl HTML Javascriptの情報サイト wrote:
HTMLで表作成(2):
前回の記事「HTMLで表作成」では、表全体の設定や、表の枠線の設定方法などtableタグの説明をしました。
今回は、表の一つ一つのセルを構成しているHTMLタグ、tdタグや、trタグの設定方法について説明します。
セル内に表示させたいテキスト量により、表示テキストが自動で折り返されてしまったり、折り返されたことにより、表示される高さが微妙に変わってしまったりなど、意図していない表示方法がされてしまう場合があります。
そうなってしまった場合などは、今回説明するHTMLタグ、trタグやtdタグの説明を参考にしていただければと思います。
2006年06月02日 11時01分44秒
Trackback URL
http://www.res-system.com/weblog/action.php?action=plugin&name=TrackBack&tb_id=136