HTMLリファレンスマニュアル

HTMLタグ完全ガイド

HTML: <caption>タグ

HTML <caption>タグは、HTMLドキュメント内のテーブルのタイトルを定義します。伝統的には、ブラウザはテーブルの上に位置する<caption>タグ内のテキストをレンダリングしますが、CSSキャプションを使用して変更することもできます。-side属性でこの動作を変更します。このタグは通常<caption>要素と呼ばれます。

HTML <caption>要素（またはHTMLテーブルのタイトル要素）は、テーブルのタイトルを表示し、通常は<table>の最初の子要素として表示され、テーブルの内容の最前面に表示されますが、CSSスタイルを使用して、テーブルに対して任意の位置に表示することもできます。

オンラインサンプル

キャプションタイトルを持つテーブル：

例

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>基礎トレーニングウェブ(oldtoolbag.com)</title>　
</head>
<body>
<table>
　　<caption>これはテーブルの見出しです</caption>
　　<tr>
　　　　<th>列　1　見出し</th>
　　　　<th>列　2　見出し</th>
　　　　<th>列　3　見出し</th>
　　</tr>
　　<tr>
　　　　<td>列のデータ　1行　2</td>
　　　　<td>列のデータ　2行　2</td>
　　　　<td>列のデータ　3行　2</td>
　　</tr>
　　<tr>
　　　　<td>列のデータ　1行　3</td>
　　　　<td>列のデータ　2行　3</td>
　　　　<td>列のデータ　3行　3</td>
　　</tr>
　　<tr>
　　　　<td>列のデータ　1行　4</td>
　　　　<td>列のデータ　2行　4</td>
　　　　<td>列のデータ　3行　4</td>
　　</tr>
</table>
</body>
</html>

テストを見て‹/›

このHTML5ドキュメントの例では、<table>タグを使用してテーブルを作成しました。<table>タグの最初は<caption>です。その後、このテーブルは3列と4行です。テーブルの第1行は最初の<tr>タグを使用して定義されたです。それは3個の<th>タグを使用して定義されたテーブルの見出しセル。このテーブルの第2～4行は<td>タグを使用して標準的なテーブルセルを定義します。

ブラウザの互換性

IEFirefoxOperaChromeSafari

すべての主要ブラウザが<caption>タグをサポートしています。

タグの定義及び使用説明

HTML <caption>要素は<body>タグ内に位置しています。
<caption>タグは<table>タグの後に現れる最初のタグです。

<table> タグは <tr>、<th>、<td> タグで構成されています。

ほとんどのブラウザはテーブルの上に <caption> タグを表示しますが、CSSの caption-side属性がこの動作を変更します。

<caption> タグはテーブルのタイトルを定義します。

<caption> タグは <table> タグのすぐ後に直接配置する必要があります。

注意：各テーブルにタイトルを指定することはできますが、1つのみです。

ヒント：デフォルトでは、テーブルのタイトルはテーブルの上に中央にアライメントされますが、CSS属性 text-alignとcaption-sideはタイトルのアライメントと配置に使用できます。

HTML 4.01 とHTML5の違い

align属性はHTMLから削除されました5中から削除されました。

属性

属性	値	説明
align	left right top bottom	HTML5 サポートされていません。HTML 4.01 廃止されました。　　タイトルのアライメントを定義します。以下のいずれかの値ができます： left-タイトルがテーブルに表示される top -タイトルがテーブルに表示される right -タイトルがテーブルに表示される bottom -タイトルがテーブルの下部に表示されるテーブルの下のテーブルを示します

グローバル属性

<caption> タグのサポート HTMLのグローバル属性。

イベント属性

<caption> タグのサポート HTMLのイベント属性。

HTML: <center>タグ HTML: <canvas>タグ