HTML <img>標籤 創建圖像映射

初級前端一枚 下面代碼是在圖片上創建圖像映射 自己整理了下 做個筆記 希望也可以幫助後來學習的朋友！

<map name="planetmap"> <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm"> <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm"> <area shape="poly" coords="23,58,8,59,40,70" alt="Venus" href="venus.htm">
</map>

該段代碼中的shape指的是點擊區域的形狀，coords指的應該是鏈接區域在圖片中的坐標（像素為單位）。

shape
1、rect 矩形
2、circle 圓形
3、poly 多邊形

coords

1、距形：左上角頂點坐標為(x1,y1)，右下角頂點坐標為(x2,y2)
2、圓形：(圓心坐標為(X1,y1)，半徑為r)
3、多邊形：(各頂點坐標依次為(x1,y1)、(x2,y2)、(x3,y3) ......)

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！