English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

HTMLリファレンスマニュアル

HTMLタグ完全ガイド

HTML: <figure> タグ

HTMLの <figure> 要素は独立した内容を表し、説明(caption)<figcaption> とよく組み合わせられます。独立した参照ユニットとして使用されると、主内容の流れに属している場合、その位置は独立しています。このタグは、通常、本文中に引用される画像、図、テーブル、コードセクションなどであり、これらが付録や他のページに移行しても、本文に影響を与えません。

オンラインの例

<figure> 要素を使用して、ドキュメント内の画像をマークアップする方法:

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>基本チュートリアルウェブ(w3(codebox.com)</title> 
</head>
<body>
<figure>
  <img src="views.png" alt="views" width="304" height="228">
</figure>
</body>
</html>
テストをしてみる ‹/›

ブラウザの互換性

IEFirefoxOperaChromeSafari

IE 9Firefox、Opera、Chrome および Safari が <figure> タグをサポートしています。

注記:IE 8 またはそれ以前のバージョンのIEブラウザでは、<figure> タグがサポートされていません。

タグの定義および使用方法

<figure> タグは独立した流れの内容(画像、グラフ、写真、コードなど)を規定します。

<figure> 要素の内容はメインコンテンツに関連しており、要素の位置はメインコンテンツに対して独立しています。削除された場合、文書の流れに影響を与えないようにする必要があります。

 通常、<figure>は画像、図、グラフ、コードの一部など、文書のメインフローで参照されるが、メインフローから他の部分や付録に移動してもメインフローに影響を与えません。

 中に<figcaption>(最初のまたは最後の子要素として)を挿入することで、タイトルと<figure>要素を関連付けることができます。図の中で最初に見つかった<figcaption>要素は、図のタイトルとして表示されます。

HTML 4.01 と HTML5の間の違い

<figure> タグは HTML 5 の中の新しいタグ。

ヒントおよび注意

ヒント:<figcaption> 要素は、<figure> 元素にタイトルを定義するために使用されます。

グローバル属性

<figure> タグのサポート HTMLのグローバル属性

イベント属性

<figure> タグのサポート HTMLのイベント属性