HOME

イメージマップ　map

クライアントイメージマップを定義する要素です。
この要素内にa要素やarea要素を配置して、ユーザー操作に反応する領域を設定します。ここで定義した内容を画像に関連付けるためには、画像を表示させる要素側のusemap属性でmap要素のid属性で付けた名前を指定します。map要素と関連付けられるのは、img要素、object要素、input要素です。
この要素内で領域を指定するには、area要素を使う方法と、a要素をブロックレベル要素内に含めて使う方法があります。XHTML1.1の場合は両方を混在させて利用できますが、XHTML1.0の場合はいずれか一方しか利用できません。

<div>
<img src="area.gif" usemap="#map" width="300" height="25" border="0" alt="メニュー" />
<map id="map" name="map">
<area href="prev.htm" shape="rect" alt="前のページ" coords="0,0,100,25" />
<area href="top.htm" shape="rect" alt="トップぺージ" coords="100,0,200,25" />
<area href="next.htm" shape="rect" alt="次のページ" coords="200,0,300,25" />
</map>
</div>

map要素内に子要素として配置することができる要素

XHTML1.1の場合は、下記の要素を必ずひとつ以上、任意の順序では位置できます。
これは、area要素での領域指定とブロックレベル要素に含まれたa要素での領域指定が同時に行えることを意味しており、古いブラウザでは、area要素、新しいブラウザではa要素での指定が有効になるように意図したものです。
これに対してXHTML1.0の場合は、area要素をひとつ以上か、area要素以外の要素を任意の順序でひとつ以上のいずれかでのみ配置することができます。