HTML中影象熱區的使用

製作人：全心全意

影象熱區：當滑鼠指向圖片的不同部位時,可以開啟不同的超連結

<map>：影象熱區標籤，包含影象熱區的各區域，有id屬性和name屬性（一個圖片分割槽域超連結）
<area>：影象熱區子標籤，影象熱區中的每一個區域

map屬性：
　　id屬性和name屬性表示名稱，設定為相同值，與img標籤的usemap屬性匹配。
area屬性：
　　shape：熱區形狀
　　　　circle：圓形，對應座標為（橫座標，縱座標，半徑）
　　　　rect：矩形，對應座標為（第一座標點橫座標，第一座標點縱座標，第二座標點橫座標，第二座標點縱座標）
　　coords：座標位置
　　href：區域連結目標
　　alt：熱區替換文字

示例程式碼：

<img src="https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=251232718,145817547&fm=26&gp=0.jpg" border="0" usemap="#pmap" alt="四季"/>

<map name="pmap" id="pmap">
	<area shape="rect" coords="0,65,125,245" href="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1602827964597&di=d8c296f5a5a21cdc6e025ca72405add8&imgtype=0&src=http%3A%2F%2Fa.hiphotos.baidu.com%2Fzhidao%2Fwh%3D450%2C600%2Fsign%3D8970f4e6d22a60595245e91e1d0418ad%2Fa8773912b31bb0512066ab07337adab44aede05b.jpg" alt="春"  />
	<area shape="rect" coords="126,65,250,245" href="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1602827999451&di=94ac33783a7a9a4625910f29f0f4629d&imgtype=0&src=http%3A%2F%2Fpic157.nipic.com%2Ffile%2F20180312%2F26217108_211757419000_2.jpg" alt="夏"  />
	<area shape="rect" coords="251,65,375,245" href="https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2418938015,1879985533&fm=26&gp=0.jpg" alt="秋"  />
	<area shape="rect" coords="376,65,500,245" href="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1602828079322&di=25e4d317a00e1d564f6d71b5b6ea19db&imgtype=0&src=http%3A%2F%2F5b0988e595225.cdn.sohucs.com%2Fq_70%2Cc_zoom%2Cw_640%2Fimages%2F20181109%2F3a7ceb21723d478cbdc91792c0aec360.jpeg" alt="冬"  />
</map>