<figure> 写真や図表などの自己完結した要素を表す

<figure>タグの説明

<figure>は、写真や図表などの自己完結した要素を表す際に使用します。この要素は、ドキュメントの本題（メインフロー）である／ないに関わらず、その段落でひとまとまりにすることができる要素を表現します。

例えば、ドキュメントの本題（メインフロー）が書かれたテキストの中で、参照される参考文献（写真、図表、コードの断片など）がある場合、メインフローに影響を与える事無く別ページ、または参照先のドキュメントへ移動する手段を提供します。

つまり、この部分を切り出して注釈や付録の位置へ移動しても、全く問題ない内容に適しています。

この要素に明示的なキャプションを追加するには、子要素に<figcaption>を追加します。

<figure>タグの特徴

• レイアウトの初期値はブロックレベルです。文章の改行に影響を与えます。
• 視覚的な効果は特に与えられませんが、指定されたコンテンツを埋め込みます。
• 同一のページ内に複数使うことができます。この要素自体を入れ子にすることも許可されています。

<figure>に指定できる主な属性

グローバル属性

全てのHTML要素に指定できる共通の属性です。詳細は一覧表で解説します。

イベントハンドラ

全てのHTML要素に指定できるコンテンツ属性です。

<figure>の使い方とサンプル

このタグを使ったマークアップのサンプルです。

<figure>
	<figcaption>この図表のキャプション</figcaption>
	<img src="../images/sample.jpg" alt="参照する図表">
</figure>