画像を囲むタグの種類と使い分けについて
最終更新日
画像を囲むタグの種類と使い分けについて解説していきます。
画像を囲むタグは主に3種類ありますので、適切なタグを使用するようにしましょう。
目次
1. 画像をタグで囲む理由
imgタグで記述した画像は、タグで囲んで使用することが多いです。
理由としては、画像の意味を明確にしたりレイアウト調整をしやすくするためです。
画像をタグで囲むというのは、HTMLのルールで決まっているわけではありませんので、必ずしも囲わなければならないわけではありません。
必要に応じて適切なタグを使用するようにしましょう。
2. 画像を囲むタグの種類と使い分け
画像を囲むタグの種類と使い分けについては下記の通りです。
- pタグ
- 文章中で使用する画像で、文脈上必要になってくる画像に使用します。この場合、imgタグのalt属性には画像の内容を説明するような文章を設定します。
- figureタグ
- 文章から参照されるようなイラスト、図、写真等に使用します。figureタグを使用した場合もimgタグのalt属性に画像の内容を設定します。また、figcaptionで注釈をつけることもできます。
- divタグ
- 上記以外の場合で、画像に対してデザインやレイアウトを変更したい場合に使用します。
3. まとめ
画像を囲むタグの種類と使い分けについて解説してきました。
画像を囲むタグは主に以下の3種類があります。
- pタグ
- figureタグ
- divタグ
それぞれ使用目的が異なりますので、用途に合ったタグを使用するようにしましょう！
