HTML <figure> タグ

❮ 前へ 完全なHTM リファレンス 次へ ❯

例

文書内の写真をマークアップするために <figure> 要素を使用します：

<figure>
  <img src="img_pulpit.jpg" alt="The Pulpit Rock" width="304" height="228">
</figure>
Try it Yourself ❯

定義と用法

<figure> タグは、イラスト、図、写真、コード·リストなどの自己完結型のコンテンツを指定します。

<figure> 要素のコンテンツは、メインフローに関連はしますが、位置はメインフローから独立しており、 削除した場合は文書のフロー影響を与えません。

ブラウザ・サポート

表中の数字は、要素を完全にサポートした最初のブラウザ・バージョンを指定しています。

要素
<figure> 6.0 9.0 4.0 5.0 11.1

HTML 4.01 と HTML5 の相違点

<figure> タグは、HTML5で新しく追加されました。

チップスと注意事項

チップ: <figcaption> 要素は、<figure> 要素に 見出しを加えるために使用します。

グローバル属性

<figure> タグは、HTML のグローバル属性もサポートします。

イベント属性

<figure> タグは、HTML のイベント属性もサポートします。

関連ページ

HTML DOM リファレンス：Figure オブジェクト

デフォルトの CSS 設定

ほとんどのブラウザは、次のデフォルト値を使用して <figure> 要素を表示しています：

例

figure {
    display: block;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 40px;
    margin-right: 40px;
}
Try it Yourself ❯


❮ 前へ 完全なHTM リファレンス 次へ ❯