<figcaption></figcaption>
| ブラウザ |
|
|---|---|
| 分類 | --- |
| 利用場所 | 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における変更点
-
- figcaption要素の配置位置に関する制限が緩くなりました。
使用例
<figure>
<figcaption>秋の公園</figcaption>
<p><img src="park.jpg" alt="写真:紅葉が始まった公園内に私の自転車が置かれています。" width="150" height="200"></p>
<p>紅葉の若洲海浜公園にて。</p>
</figure>
- 表示例
-
秋の公園 
紅葉の若洲海浜公園にて。