area要素・areaタグとは

イメージマップの区域を指定するarea要素

area要素はmap要素と共に利用されます(mapタグに包まれる子要素として記述されます)。
画像の一部区域を指定し、ハイパーリンクと関連付ける役割を持ちます。map要素の中に複数のarea要素を記述する事ができます。

[htmlsrc]
1<img src="menu.gif" usemap="#map1" alt="メニュー" />
2<map name="map1">
3 <area href="guide.html"
4          alt="ガイド"
5          shape="rect"
6          coords="0,0,118,28">
7 <area href="beginner.html"
8          alt="初めての方へ"
9          shape="rect"
10          coords="184,0,276,28">
11 <area href="recommend.html"
12          alt="お勧め情報"
13          shape="circle"
14          coords="184,200,60">
15 <area href="contact.html"
16          alt="お問い合わせ"
17          shape="poly"
18          coords="276,0,276,28,100,200,50,50,276,0">
19</map>
[attr]
shape = default|rect|circle|poly
領域の形状を指定する。

  • default: 領域全体を指定する。
  • rect: 長方形の領域を指定する。
  • circle: 円形の領域を指定する。
  • poly: 多角形の領域を指定する。
coords = coordinates
スクリーン上の位置と形状を指定する。shape属性での指定により設定値と順序は変化する。

  • rect: left-x, top-y, right-x, bottom-y
  • circle: center-x, center-y, radius
  • poly: x1, y1, x2, y2, … xN, yN
    多角形を閉じるため、最初と最後の座標を一致させること。
nohref
当該領域は関連したリンクを持たないことを意味する。
[/attr]

コメントを残す

メールアドレスが公開されることはありません。