さすらいのWeb制作家、MAKOCHINがつづるブログサイト。
Web制作に関する知識を備忘録的に書いているだけのサイトです。
ほとんど自分で見るためだけに書いているような内容なので読みやすくはなっていませんが、Web制作のお役に立てれば幸いです。
ご興味のある方はどうぞ。

【HTML5】figure要素、figcaption要素について

Pocket
LINEで送る

HTML5におけるfigure要素、figcaption要素の使用例を紹介します。

figure要素は、メインコンテンツ内から参照される図、写真、イラスト、動画、ソースコード等をマークアップする要素です。

figcaption要素は、figure要素のキャプションをマークアップする要素で、figure要素内で使用します。

<header>
  <hgroup>
    <h1>タイトル</h1>
    <h2>サブタイトル</h2>
  </hgroup>
</header>
<section>
  <p>記事本文が入ります</p>
  <figure>
    <img src="sample.jpg" alt="サンプル画像" width="300" height="225">
    <figcaption>
      写真のキャプション
    </figcaption>
  </figure>
</section>

figcaption要素はfigure要素内の最初か最後で使用します。

カテゴリー:HP制作, HTML5

コメントを残す

コメント内容