HTML5 中创建图片点击热点区域时 怎么知道那个区域在哪

html-css09

HTML5 中创建图片点击热点区域时 怎么知道那个区域在哪,第1张

图片热点区域中,rect 矩形区域,使用2个做点来确定具体位置和大小。

shape="rect" 

coords="x1,y1,x2,y2"

以图片的左上角为坐标原点,矩形的左上角坐标x1,y1和矩形的右下角坐标x2,y2来确定具体位置和大小。

结合具体的代码来解释

coords="0,0,110,260"

0,0就是矩形的左上角坐标

该点距离图片的左上角横向距离为0

该点距离图片的左上角纵向距离为0

110,260就是矩形的右下角坐标

该点距离图片的左上角横向距离为110

该点距离图片的左上角纵向距离为260

图示

<a href="链接的地址"><img src="图片的URL" width="图片的宽度" height="图片的高度" border="边框"></a>