熱區

HTML圖檔熱區map area的用法

支援 IE，Firefox，Chrome，Safari，Opera。所有主浏覽器都支援。

<area>

标記主要用于圖像地圖，通過該标記可以在圖像地圖中設定作用區域（又稱為熱點），這樣當使用者的滑鼠移到指定的作用區域點選時，會自動連結到預先設定好的頁面。其基本文法結構如下：

<img src="圖檔位址" border="0" usemap="#planetmap" alt="Planets" />

<map name="planetmap" id="planetmap">
  <area shape="circle" coords="180,139,14" href ="venus.html" alt="Venus" />
  <area shape="circle" coords="129,161,10" href ="mercur.html" alt="Mercury" />
  <area shape="rect" coords="0,0,110,260" href ="sun.html" alt="Sun" />
</map>
           

定義和用法

<area>

标簽定義圖像映射中的區域（注：圖像映射指得是帶有可點選區域的圖像）。

area 元素總是嵌套在

<map>

标簽中。

注釋：

<img>

标簽中的 usemap 屬性與 map 元素 name 屬性相關聯，建立圖像與映射之間的聯系。

提示和注釋：

注釋：

<img>

中的 usemap 屬性可引用

<map>

中的 id 或 name 屬性（由浏覽器決定），是以我們需要同時向

<map>

添加 id 和 name 兩個屬性。

屬性	值	描述
alt	text	定義此區域的替換文本

屬性	值	描述
coords	坐标值	定義可點選區域（對滑鼠敏感的區域）的坐标
href	URL	定義此區域的目标 URL
nohref	nohref	從圖像映射排除某個區域
shape	default rect circ poly	定義區域的形狀
target	_blank _parent _self _top	規定在何處打開 href 屬性指定的目标 URL

shape和coords：是兩個主要的參數，用于設定熱點的形狀和大小。其基本用法如下：

<area shape="rect" coords="x1,y1,x2,y2" href=url>

表示設定熱點的形狀為矩形，左上角頂點坐标為（X1,y1），右下角頂點坐标為（X2,y2）。

<area shape="circle" coords="x1, y1,r" href=url>

表示設定熱點的形狀為圓形，圓心坐标為（X1,y1），半徑為r。

<area shape="poligon" coords="x1, y1,x2,y2 ......" href=url>

表示設定熱點的形狀為多邊形，各頂點坐标依次為（X1,y1）、（X2,y2）、（x3,y3） ……