設(shè)置圖像映射 HTML

在網(wǎng)頁設(shè)計(jì)過程中，有時(shí)候需要在圖像上的某個(gè)區(qū)域或多個(gè)區(qū)域設(shè)置鏈接，這就需要用到圖像映射。圖像映射是一個(gè)能對(duì)鏈接指示做出反應(yīng)的圖形，單擊該圖像的已定義區(qū)域，可轉(zhuǎn)到與該區(qū)域相鏈接的目標(biāo)。圖像映射也稱為熱區(qū)鏈接，就是在圖像上設(shè)置一到多個(gè)熱點(diǎn)區(qū)域（熱區(qū)），然后在每個(gè)熱區(qū)上都可以設(shè)置超鏈接。

圖像映射的實(shí)現(xiàn)需要使用<map>元素和<area>元素，<map>元素用來創(chuàng)建圖像映射，與<img>元素關(guān)聯(lián)起來。<area>元素包含在<map>元素之間，用于創(chuàng)建圖像映射中一個(gè)個(gè)的熱區(qū)，并規(guī)定熱區(qū)的形狀和位置。

基本語法如下：

<img src="圖像路徑"usemap="#圖像映射名稱"/>

<map name="圖像映射名稱"id="圖像映射名稱">

    <area shape="形狀"coords="坐標(biāo)"href="URL"/>

    <area shape="形狀"coords="坐標(biāo)"href="URL"/>

    ...

</map>

語法說明：

<map>用于定義客戶端圖像映射，name屬性在<map>元素中是必需的，該屬性和<img>元素的usemap屬性關(guān)聯(lián)，創(chuàng)建圖像和圖像映射之間的關(guān)系。另外，值得注意的是，有些瀏覽器可能會(huì)支持<img>的usemap屬性引用<map>的id屬性，所以我們可以同時(shí)向<map>添加name和id屬性，并且為兩者設(shè)置相同的值。