HTML5 <area> タグ
例
クリック可能なエリアを持つイメージマップ:
<img src ="planets.gif"
width="145" height="126"
alt="Planets"
usemap ="#planetmap" />
<map
name="planetmap">
<area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun" />
<area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury" />
<area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus" />
</map>
Try it yourself »
ブラウザ・サポート

<area> タグは、主要な全ブラウザがサポートしています。
定義と用法
<area> タグは、イメージマップの中のエリアを定義します(イメージマップは、クリック可能なエリアを持つイメージです)。
<area> 要素は、常に <map> タグの中にネストします。
注: <img> タグの usemap 属性は、
map 要素の name 属性と結びついて、イメージとマップの間の関係を作成します。
HTML 4.01 と HTML5 との相違点
HTML5 には、いくつかの新しい属性がサポートされると共に、HTML4.01属性のいくつかのはサポートされなくなりました。
属性
New : HTML5 で新規追加。
属性 |
値 |
説明 |
alt |
text |
area の代替テキストを指定する。href 属性があれば必須 |
coords |
coordinates |
area の座標を指定する |
href |
URL |
area へのハイパーリンクのターゲットを指定する |
hreflangNew |
language_code |
ターゲット URL の言語を指定 |
mediaNew |
media query |
ターゲット URL が、どのようなメディア/デバイスに最適化されているかを指定する |
nohref |
nohref |
HTML5 ではサポートしていない |
relNew |
alternate
author
bookmark
help
license
next
nofollow
noreferrer
prefetch
prev
search
tag |
現在の文書と、ターゲット URL 間の関係を指定する |
shape |
default
rect
circle
poly |
area の形状を指定する |
target |
_blank
_parent
_self
_top
framename |
ターゲット URL をどこにオープンするかを指定する |
typeNew |
MIME_type |
ターゲット URL の MIME タイプを指定する |
グローバル属性
<area> タグは、HTML5におけるグローバル属性 もサポートします。
イベント属性
<area> タグは、HTML5におけるイベント属性 もサポートします。
|