HTML figure要素で画像一覧

概要

タイトル付きの写真を横並び表示しようとして見つけたHTML5 figureタグ。もともとは、論文などの図(表)を表現する要素だと思います。figure要素内に、img要素とfigurecaption要素を含むことができます。cssファイルを使えば横並びにするのも簡単です。 

htmlファイル
<article>
  <firgure>
    <img src="..."/>
    <figureCaption>1枚目の写真</figureCaption>
  </figure>
  <firgure>
    <img src="..."/>
    <figureCaption>2枚目の写真</figureCaption>
  </figure>
</article>

cssファイル
figure {
  float: left;
}

関連資料