本文以矩形为例，最快上手图片定位，其他形状（shape）类似，难点在于coords定位法则不同。
 

一、（矩形）html代码

  

   

    

     

    
    

     

      <map name="Map">
     
    
   

    

     

    
    

     
        <area shape="rect" coords="60,300,225,365" href="examRule.jsp">
     
    
   

    

     

    
    

     
        <area shape="rect" coords="300,260,465,305" href="manage/stuResult.do?action=stuResultQueryS&ID=${student}">
     
    
   

    

     

    
    

     
        <area shape="rect" coords="490,290,670,350" href="manage/student.do?action=modifyQuery&ID=${student}">
     
    
   

    

     

    
    

     
        <area shape="rect" coords="750,260,920,330" href="logout.jsp">
     
    
   

    

     

    
    

     

      </map>
     
    
  
 

如图

 

二、（矩形）map属性说明

<area shape="rect" coords="60,300,225,365" href="examRule.jsp">
 

参数说明

erea         表示一个区域;
shape      属性表示定位的区域形状，shape="rect"，表示长方形（rectangle）;
coords    属性表示坐标描述，coords="x1,y1,x2,y2"，(x1,y1)表示矩形的左上角顶点位置，(x2,y2)表示矩形的右下角顶点位置，2点即可确定一个矩形。
href          属性表示点击定位的区域，跳转页面url。


 

文章来源: blog.csdn.net，作者：吾日三省贾斯汀，版权归原作者所有，如需转载，请联系作者。

原文链接：blog.csdn.net/JustinQin/article/details/80660259