<caption>〜</caption>
<caption align="表示位置">〜</caption>
表示位置‥‥‥top又はbottom
要素名 | 属性名 | 説明 | 非推奨 | 必須属性 |
---|---|---|---|---|
caption | 表のタイトル | |||
align | 表示位置 | 非推奨 | ||
class | クラス名 | |||
id | ID名 | |||
title | 補足情報 | |||
style | スタイルシート | |||
lang | 言語コード | |||
dir | 文字表記の方向 |
表にタイトルを設定するにはcaption要素を使用します。caption要素は、必ずtable要素の開始タグ<table>の直後に
配置してください。表示位置はalign属性を使って、表の上(top)又は表の下(bottom)が指定出来ます。指定しない場合は、表の上に表示されます。
ただし、align属性はHTML4.01では非推奨です。表示位置を指定するときは、スタイルシートを利用してください。
ただし、align属性はHTML4.01では非推奨です。表示位置を指定するときは、スタイルシートを利用してください。
Sample
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<base href="http://www.abcd.com/efg/index.html">
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta name="author" content="制作者名">
<meta name="description" content="内容の紹介">
<meta name="keywords" content="キーワード1,キーワード2,キーワード3,・・・">
<link rel="start" href="start.html">
<link rel="index" href="index.html">
<title>表のタイトルを設定する。</title>
</head>
<body>
<table border="2">
<caption>表のタイトルを設定する</caption>
<tr><th>見出し1</th><th>見出し2</th><th>見出し3</th></tr>
<tr><td>データ1</td><td>データ2</td><td>データ3</td></tr>
<tr><td>データ4</td><td>データ5</td><td>データ6</td></tr>
<tr><td>データ7</td><td>データ8</td><td>データ9</td></tr>
</table>
<table border="2">
<caption align="top">表のタイトルを設定する</caption>
<tr><th>見出し1</th><th>見出し2</th><th>見出し3</th></tr>
<tr><td>データ1</td><td>データ2</td><td>データ3</td></tr>
<tr><td>データ4</td><td>データ5</td><td>データ6</td></tr>
<tr><td>データ7</td><td>データ8</td><td>データ9</td></tr>
</table>
<table border="2">
<caption align="bottom">表のタイトルを設定する</caption>
<tr><th>見出し1</th><th>見出し2</th><th>見出し3</th></tr>
<tr><td>データ1</td><td>データ2</td><td>データ3</td></tr>
<tr><td>データ4</td><td>データ5</td><td>データ6</td></tr>
<tr><td>データ7</td><td>データ8</td><td>データ9</td></tr>
</table>
</body>
</html>
<html lang="ja">
<head>
<base href="http://www.abcd.com/efg/index.html">
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta name="author" content="制作者名">
<meta name="description" content="内容の紹介">
<meta name="keywords" content="キーワード1,キーワード2,キーワード3,・・・">
<link rel="start" href="start.html">
<link rel="index" href="index.html">
<title>表のタイトルを設定する。</title>
</head>
<body>
<table border="2">
<caption>表のタイトルを設定する</caption>
<tr><th>見出し1</th><th>見出し2</th><th>見出し3</th></tr>
<tr><td>データ1</td><td>データ2</td><td>データ3</td></tr>
<tr><td>データ4</td><td>データ5</td><td>データ6</td></tr>
<tr><td>データ7</td><td>データ8</td><td>データ9</td></tr>
</table>
<table border="2">
<caption align="top">表のタイトルを設定する</caption>
<tr><th>見出し1</th><th>見出し2</th><th>見出し3</th></tr>
<tr><td>データ1</td><td>データ2</td><td>データ3</td></tr>
<tr><td>データ4</td><td>データ5</td><td>データ6</td></tr>
<tr><td>データ7</td><td>データ8</td><td>データ9</td></tr>
</table>
<table border="2">
<caption align="bottom">表のタイトルを設定する</caption>
<tr><th>見出し1</th><th>見出し2</th><th>見出し3</th></tr>
<tr><td>データ1</td><td>データ2</td><td>データ3</td></tr>
<tr><td>データ4</td><td>データ5</td><td>データ6</td></tr>
<tr><td>データ7</td><td>データ8</td><td>データ9</td></tr>
</table>
</body>
</html>
Internet Explorer8での表示例
