<img> - イメージ

■ 概要

項  目説  明
記述形式 <img src="画像ファイル" alt = "画像内容の説明">
対応ブラウザー H2+ / e2+ / N2+ / Fx1+ / Op6+ / Ch1+ / Sa1+
種  類
(カテゴリー)
フロー・コンテンツフレージング・コンテンツエンベッディッド・コンテンツ
インタラクティブ・コンテンツusemap属性をもつとき),パルパブル・コンテンツ  
置ける場所 エンベッディッド・コンテンツが記入できる場所
内包要素
(コンテンツ・モデル)

(コンテンツ・モデル:

■ 解説

<img> は IMaGe(画像)の略です。 src属性には,GIF形式(*.gif),JPEG形式(.jpg),PNG形式(*.png)などの画像ファイルを指定します。

すでに HTML4.01 で,画像を表示できないブラウザーや,文字は音声に変換して読めても画像を見ることのできない人のために,<img> タグには alt属性 が必須とされていました。 HTML5 でも,例外は認められているものの alt属性 が必須です。 記入を忘れないようにしましょう。(詳細は「alt属性による説明文の書き方について」を参照。)

必須属性ではありませんが,height属性width属性も極力指定するようにしましょう。 これらの属性を指定しないと,ブラウザーがページを表示する際に,画像を読み込む度に画面全体のレイアウトが変更されてしまい,ページ表示の体感速度が遅くなってしまいます。

■ 属性

種  類名  称
【固有属性】 altsrccrossorigin *usemapismapwidthheight
【グローバル属性】 accesskeyclasscontenteditable * dir
hidden *idlangspellcheck *style
tabindextitletranslate *
【ARIA role属性】
指定可能な値 (役割)
presentation のみ (alt属性 が 空の場合),
任意の値 (役割) (その他の場合)
【ARIA aria-* 属性】
指定可能なもの
ARIA グローバル状態とプロパティ
指定可能な役割の任意の状態とプロパティ   

■ CSSプロパティ

種  類名  称
【よく使うもの】 floatclearposition                                    

■ 使用例

HTMLソース
HTML
<body> ~ </body>
<img src="image/xxx.gif" alt="イラスト2" width="100" height="100">

ブラウザー 表示例
イラスト2

■ 備考