今天看了一個html5在圖片上面創建熱點的標簽，所謂圖片熱點就是給你一張圖片然后你可以設置點擊圖片不同的位置進入不同的鏈接！如果下面是一張圖片的話，里面在長方形、圓形、三角形區域都可以進入其他網頁！
下面，我們來實例介紹map，area這些標簽的用法！
1，制作矩形熱點
(1),shape標簽表示熱點的形狀，有矩形（rectangle），圓形（circle），多邊形（polygon）和整個圖片（default）
(2),coords是每個形狀的坐標，不同形狀坐標表示不同！上面矩形的坐標(x1,y1,x2,y2)，其中(x1,y1)是矩形左上角的坐標,(x2,y2)是矩形右下角的坐標
2，制作圓形熱點
圓形的坐標(x,y,radius)，其中(x,y)是圓心的坐標，radius是圓的半徑
3，制作多邊形熱點（下面是三角形）
多邊形的坐標(x1,y1,x2,y2,x3,y3,...)有多少組(x,y)坐標就有幾個角，也就是說，多邊形每一個角的坐標都要在coords中！
注意：
1，coords里面的坐標是按照圖片大小來的，不是按照瀏覽器窗口大小來的！所以圖片的左上角的坐標是(0,0)，右下角是(圖片的長，圖片的寬)
2，一般這種確定你想要的區域的坐標，單靠眼睛看是不可能看出來的，所以你需要借助截屏工具來確定區域的坐標！打開截屏工具，從圖片的左上角開始拉到你想要的那個點，顯示的長和寬就是這個點的坐標！
想要每天及時獲取王業樓的個人博客更新的內容嗎？趕快添加微信公眾號“ly89cn”，或者掃描下方的二維碼吧！
本文來源於王業樓的個人博客，本文地址：http://www.ly89.cn/detailB/62.html
歡迎分享本文，轉載請注明本文出處和地址