HTML&CSS

【HTML】イメージタグ<img>

イメージタグ<img>

画像の表示に用いる要素は<img>タグです。

「img」は「image(イメージ)」の略で、画像をイメージのように表示するには「src属性」のurlの部分に画像のリンクを指定することで、画像を表示することができます。

 html
<img src="url">

<img>要素は上記のようにテキストを囲むことがないため、終了タグが要りません。

イメージタグ<img>の使い方

Webページで使用する画像の形式は、一般的にはGIFとJPEGになります。

よく使用される画像の形式

  • GIF (拡張子 .gif):256色(8bit)まで使用可能です。イラスト向きの形式で、色数の少ない単調な画像に適しています。
  • JPEG (拡張子 .jpg):約1677万色(24bit)まで使用可能です。写真向きの形式で、色数の多い複雑な画像に適しています。
  • PNG (拡張子 .png)」約1677万色(24bit)まで使用可能です。イラスト向きの形式で、色数の少ない単調な画像に適しています。

PNGは写真などで使用する場合は、データ量が大きくなってしまうので注意が必要です。(しかし、画質の劣化がないのでJPEGより綺麗に表示されます)

また、PNG形式の画像は、古いブラウザでは対応していなかったり、対応が不完全の場合が多いので、注意が必要です。

 html
<img src="https://issy9174.com/wp-content/uploads/2021/04/HTMLCSS.jpg">







-HTML&CSS

© 2021 Issy9174 official web site