<img> 要素
は、イメージを表します。src 属性
で指定されたURLの画像を表示します。画像の表示や読み込みが無効、または処理できない環境のための代替テキストをalt 属性
に指定します。
- カテゴリー
- フロー・コンテンツ、パルパブル・コンテンツ、フレージング・コンテンツ、埋め込みコンテンツ、インタラクティブ・コンテンツ
- 配置場所
- 埋め込みコンテンツが置ける場所。
- 内容
- なし(空要素)
- 属性
-
alt="代替テキスト"
- 画像の表示や読み込みが無効、または処理できない環境のための代替テキストを指定します。
src 属性
が指定され、画像が利用可能な場合はalt 属性
の値は表示されません。 src="URL"
- 画像のURLを指定します。
crossorigin=""
- 画像が他のドメインに存在する場合にクロスドメイン通信を行うためのCORS(Cross-Origin Resource Sharing)リクエストの設定をします。
参考:http://www.w3.org/TR/html5/infrastructure.html#cors-settings-attribute
usemap="#名前"
usemap 属性
が存在する場合、関連する<map> 要素
を示すことができます。値は#
に続けて<map> 要素
のname 属性
を指定します。ismap[="ismap"]
- 属性のセットにより、サーバサイド・イメージマップであることを表します。
width="幅"
- 画像の幅をピクセル数で指定します。
height="高さ"
- 画像の高さをピクセル数で指定します。
- グローバル属性
accesskey
,autocapitalize
,autofocus
,class
,contenteditable
,data-*
,dir
,draggable
,enterkeyhint
,hidden
,id
,inputmode
,is
,itemid
,itemprop
,itemref
,itemscope
,itemtype
,lang
,nonce
,spellcheck
,style
,tabindex
,title
,translate
サンプル
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8" />
<title>HTML5 › img</title>
</head>
<body>
<h1>HTML5 › img</h1>
<p>HTML5のロゴ</p>
<p><img src="https://emwai.jp/files//badge/HTML5_Logo_512.png" width="256" height="256" alt="HTML5"></p>
</body>
</html>