<figcaption> 参照される写真や図表にキャプションを追加する

取り扱い 現行の標準
カテゴリ なし
親にできる要素 <figure>
子にできる要素 フロー・コンテンツ
対応ブラウザ caniuseで確認

<figcaption>タグの説明

<figcaption>は、<figure>で指定された写真や図表などの自己完結した内容に対して、キャプションを追加する際に使用します。この要素は必須という訳ではありません。

<figcaption>を用いる場合は、<figure>の開始直後に最初の子要素として配置するか、終了間近に最後の子要素として配置します。

<abbr>タグの特徴

  • レイアウトの初期値はブロックレベルです。文章の改行に影響を与えます。
  • 視覚的な効果は特に与えられません。必要に応じてスタイルシートを調整して下さい。
  • 同一のページ内に複数使うことができます。ただし、親となる<figure>の中には一つだけしか配置できません。

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

グローバル属性
全てのHTML要素に指定できる共通の属性です。詳細は一覧表で解説します。
イベントハンドラ
全てのHTML要素に指定できるコンテンツ属性です。

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

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

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

<figcaption>に関連するHTMLタグ

オブジェクトやスクリプトを埋め込む要素
<img> 画像を表示する
<picture> 特定の画像に対して複数のメディアソースを提供するコンテナを設置する
<figure> 写真や図表などの自己完結した要素を表す
<figcaption> 参照される写真や図表にキャプションを追加する
<canvas> スクリプトで定義したグラフィックスを描画するための領域を配置する
<audio> ドキュメント内に音声コンテンツを埋め込む
<video> ページ内に動画コンテンツを表示する
<source> 再生候補となる動画や音源などのメディアソースを指定する
<track> 動画や音声ファイルに字幕やキャプションを追加する
<embed> 外部コンテンツを埋め込む
<object> 外部リソースのオブジェクトを埋め込む
<param> パラメーターを指定する
<script> HTMLで実行可能なスクリプトを埋め込む
<noscript> スクリプトが動作しない環境での表示内容を指定する
<meter> 規定範囲内の数量や測定値を表す
<progress> 作業の進捗状況を示すプログレスバーを表示する
<output> 計算結果やユーザーアクションの出力欄を作成する
<dialog> 任意のタイミングで開くダイアログボックスを作成する
<template> ページ読み込み後にスクリプトの実行によって挿入可能な要素を定義する
<slot> ウェブコンポーネントで独自に扱える枠を提供する