最終更新日
子要素のarea要素と組み合わせて、クリック可能なイメージマップを定義します。画像自体は、img要素またはobject要素のusemap属性で指定します。
name属性では、イメージマップの名前を定義します。name属性の指定は必須で、値に空の文字列や、スペース文字を含むことはできません。また、同じドキュメント内にある別のmap要素のname属性と重複した名前を付けることもできません。id属性を指定するときは、name属性と同じ値を使用してください。
map要素がPhrasingコンテンツのみを含む場合、Phrasingコンテンツの記述箇所で使用できます。それ以外の場合はFlowコンテンツの記述箇所で使用できます。
カテゴリ | タグの省略 | 親要素 | 子要素 |
---|---|---|---|
Flowコンテンツ Phrasingコンテンツ |
省略不可 | この要素がPhrasingコンテンツのみ含む場合はPhrasingコンテンツを子にできる要素。そうでなければFlowコンテンツを子にできる要素。 | Transparent |
属性 | 値 | 説明 |
---|---|---|
name | 文字列 | イメージマップの名前を指定します。 |
グローバル属性 | - | - |
イベント属性 | - | - |
<body> <h1>モーニングセット</h1> <p>下記の画像をクリックすると、それぞれの商品ページに移動します。</p> <p> <img src="morning.jpg" usemap="#morningset"> <map name="morningset"> <area href="muffin.html" shape="circle" coords="120,140,110" alt="マフィン"> <area href="potato.html" shape="rect" coords="10,50,70,90" alt="ポテト"> <area href="coffee.html" shape="rect" coords="70,10,140,40" alt="コーヒー"> </map> </p> </body>