プログラミング

figureとfigcaption要素について【HTML】

Webページのコンテンツは文字だけではありません。

写真やイラストを入れることもあると思います。

そういったときに使うタグ、figureやfigcaptionについてです。

figure(フィギュア)

figure要素は写真・図表・イラスト・コードなどのまとまりを表すもので、それらはもしなくても文書に影響がないような単独のものでないといけません。

また、figure要素の内容に関して、キャプション(説明文)を記述することもできます。

figcaption(フィギュア・キャプション)

キャプションを付与するための要素がfigcaptionという要素。

これを使うことで親要素であるfigure要素の内容にキャプションをつけることができます。

キャプションとはつまり写真・図表・イラスト・コードなどの内容を表す説明文のことで、実際にブラウザ上に表示されます。

<figure>
  <img src=”/img/ramen.jpg” alt=”ラーメン”>
  <figcaption>これは福岡で食べたラーメンです。</figcaption>
</figure>

このfigcaptionの記述は必ず必要というわけではありません。

Leave a Comment