HTML の <map> 要素はイメージマップ (クリック可能なリンク領域) を定義するために <area> 要素とともに使用します。

コンテンツカテゴリ フローコンテンツ記述コンテンツ、知覚可能コンテンツ
許可されている内容 透過的要素
タグの省略 不可。開始と終了タグの両方が必要。
許可されている親要素 記述コンテンツを受け入れるすべての要素
許可されている ARIA ロール なし
DOM インターフェイス HTMLMapElement

属性

この要素はグローバル属性を持ちます。

name
name 属性は、マップを参照可能にするための名前を与えます。この属性は指定しなければならず、値は空文字列ではなく空白文字を含まないものにしなければなりません。name 属性の値は、同一文書内の別の map 要素の name 属性の値と compatibility-caseless 方式で一致してはいけません。id 属性も指定した場合は、両方の属性の値を同一にしなければなりません。

<map name="primary">
  <area shape="circle" coords="75,75,75" href="left.html">
  <area shape="circle" coords="275,75,75" href="right.html">
</map>
<img usemap="#primary" src="https://placehold.it/350x150" alt="350 x 150 pic">

ライブ例

想定されるライブ例の結果

上の live example は、(キーボードの Tab キーを使用すると) 以下の画像のようになるはずです:

left.html へのリンク:

right.html へのリンク

仕様書

仕様書 状態 備考
HTML Living Standard
<map> の定義
現行の標準  
HTML5
<map> の定義
勧告  
HTML 4.01 Specification
<map> の定義
勧告 初回定義

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOS 版 SafariSamsung Internet
基本対応Chrome 完全対応 1Edge 完全対応 ありFirefox 完全対応 1
補足
完全対応 1
補足
補足 Before Firefox 5, in Quirks Mode, empty maps were longer skipped over in favor of non-empty ones when matching.
補足 Before Firefox 17, the default styling of the <map> HTML element was display: block;. This is now display: inline; and matches the behavior of the other browsers. It was already the case in Quirks Mode.
IE 完全対応 ありOpera 完全対応 ありSafari 完全対応 1WebView Android 完全対応 1Chrome Android 完全対応 18Edge Mobile 完全対応 ありFirefox Android 完全対応 4Opera Android 完全対応 ありSafari iOS 完全対応 ありSamsung Internet Android 完全対応 あり
nameChrome 完全対応 1Edge 完全対応 ありFirefox 完全対応 1IE 完全対応 ありOpera 完全対応 ありSafari 完全対応 1WebView Android 完全対応 1Chrome Android 完全対応 18Edge Mobile 完全対応 ありFirefox Android 完全対応 4Opera Android 完全対応 ありSafari iOS 完全対応 ありSamsung Internet Android 完全対応 あり

凡例

完全対応  
完全対応
実装ノートを参照してください。
実装ノートを参照してください。

関連情報