CSS圖像熱區
在img標簽當中，存在一個屬性usemap屬性，用來和map標簽進行綁定，從而實現圖像熱區。所謂的圖像熱區，其實指的是在圖像中插入一個連接，當用戶點擊圖像的指定區域后就會進行頁面跳轉。
demo:
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>圖像熱區</title>
</head>
<body>
<img src="photo3.jpg" usemap="#toLink">
<map name="toLink" id="toLink">
<area shape="rect" coords="0,0,300,300" href="http://www.baidu.com" title="百度一下,你就知道">
</map>
</body>
</html>
當我們點擊圖片當中相應位置之后，效果如下：
在上面的效果圖當中，在我們點擊之后出現的藍色區域就是圖像熱區的區域，只要我們在藍色區域內點擊，都會跳轉到預先設置好的網址去。
map標簽的name和id屬性:
在map標簽中存在name和id屬性，這兩個屬性主要是用來和img標簽建立聯系，讓img標簽能夠和我們創建的圖像熱區相互結合。
area標簽:
area標簽里面存在幾個非常重要的屬性。
1、shape屬性表示熱區的形狀。
rect 矩形
circle 圓形
poly 多邊形
2、coords表示形狀關鍵點的坐標。
rect -> 對應左上角和右下角的坐標
circle -> 對應圓心坐標和半徑長度
poly -> 對應每一個定點的坐標
3、href表示熱區對應的連接地址。
既可以跳轉本地文件，也可以跳轉其他連接。
4、target 表示設置在何處打開href屬性指定的url。