<caption align=""></caption>

ブラウザ
  • IE
  • Cr
  • Sf
  • Fx
  • O
分類
要素

caption要素に align="" を追加すると、表タイトルの表示位置を指定できます。


<caption align="bottom">表のタイトル</caption>
属性 値 説明
align="" top 表の上部中央に表示 （初期値）
bottom 表の下部中央に表示
left 表の左側に表示
right 表の右側に表示
  • left と right の指定は、SafariとChromeでは対応していないようです。

上記の属性は、HTML 4.01では非推奨とされています。（Strict DTDでは使用できません）

表示位置の違い

left と right の指定は、ブラウザにより解釈が異なります（タイトルの表示位置が異なります）。これらの値を指定した場合、IEなどでは表の上部の左側（または右側）にタイトルが表示されますが、Firefoxなどでは表の左側（または右側）に回り込む形でタイトルが表示されます。

使用例

表示位置を指定しない場合の例

<table border="3">
<caption>表のタイトル</caption>
<tr>
<td>データ1-1</td>
<td>データ1-2</td>
<td>データ1-3</td>
</tr>
<tr>
<td>データ2-1</td>
<td>データ2-2</td>
<td>データ2-3</td>
</tr>
</table>
表示例
表のタイトル
データ1-1 データ1-2 データ1-3
データ2-1 データ2-2 データ2-3
bottomを指定した例

<table border="3">
<caption align="bottom">表のタイトル</caption>
<tr>
<td>データ1-1</td>
<td>データ1-2</td>
<td>データ1-3</td>
</tr>
<tr>
<td>データ2-1</td>
<td>データ2-2</td>
<td>データ2-3</td>
</tr>
</table>
表示例
表のタイトル
データ1-1 データ1-2 データ1-3
データ2-1 データ2-2 データ2-3
leftを指定した例

<table border="3">
<caption align="left">表のタイトル</caption>
<tr>
<td>データ1-1</td>
<td>データ1-2</td>
<td>データ1-3</td>
</tr>
<tr>
<td>データ2-1</td>
<td>データ2-2</td>
<td>データ2-3</td>
</tr>
</table>
表示例
表のタイトル
データ1-1 データ1-2 データ1-3
データ2-1 データ2-2 データ2-3
rightを指定した例

<table border="3">
<caption align="right">表のタイトル</caption>
<tr>
<td>データ1-1</td>
<td>データ1-2</td>
<td>データ1-3</td>
</tr>
<tr>
<td>データ2-1</td>
<td>データ2-2</td>
<td>データ2-3</td>
</tr>
</table>
表示例
表のタイトル
データ1-1 データ1-2 データ1-3
データ2-1 データ2-2 データ2-3