<figcaption></figcaption>

ブラウザ
  • IE
  • Cr
  • Sf
  • Fx
  • O
分類 ---
利用場所 figure要素の最初または最後の子要素として(HTML 5.1ではfigure要素の子要素として任意の位置)
内容 フロー・コンテンツ

figcaption要素は、参照される図版のキャプション(タイトルや説明)を表します。


<figure>
<figcaption>図版のキャプションを表します</figcaption>

</figure>

figcaption要素は、figure要素内の最初か最後のどちらかにのみ(1つだけ)配置することができます。(HTML 5.1の場合は任意の位置に配置できます)

<figure>
<figcaption>キャプション</figcaption>
<p><img src="example.gif" alt="サンプル"></p>
</figure>
<figure>
<p><img src="example.gif" alt="サンプル"></p>
<figcaption>キャプション</figcaption>
</figure>

2つのキャプションを配置したい場合は、次のように最初のキャプションを見出しとするか、

<figure>
<h1>図版のタイトル</h1>
<p><img src="example.gif" alt="サンプル"></p>
<figcaption>図版の説明</figcaption>
</figure>

後ろのキャプションをp要素などで配置すると良いでしょう。

<figure>
<figcaption>図版のタイトル</figcaption>
<p><img src="example.gif" alt="サンプル"></p>
<p>図版の説明</p>
</figure>
HTML 5.1における変更点

使用例

写真にキャプションを付けた例

<figure>

<figcaption>秋の公園</figcaption>
<p><img src="park.jpg" alt="写真:紅葉が始まった公園内に私の自転車が置かれています。" width="150" height="200"></p>
<p>紅葉の若洲海浜公園にて。</p>

</figure>

表示例
秋の公園

写真:紅葉が始まった公園内に私の自転車が置かれています。

紅葉の若洲海浜公園にて。