HTML点击一张图片不同地方跳转不同页面

最新推荐文章于 2024-02-20 15:31:47 发布

后生丶

最新推荐文章于 2024-02-20 15:31:47 发布

阅读量1.6w

点赞数 6

分类专栏： html

本文链接：https://blog.csdn.net/qq_30449567/article/details/80395310

版权

html 专栏收录该内容

7 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>  
<html>  
<head>  
<meta charset="utf-8">  
<title>点击图片不同地方跳转不同页面</title>  
</head>  
<body>  
   /// 打开页面显示的图片  
<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">  
  
   /// img标签的usemap属性的值是下面map标签name属性的值（做关联）  
<map name="planetmap">  
   // area标签的shape属性的值rect为矩形，矩形的coords属性值有四个，分别是选取矩形图片定位的值,前两个表示左上角的定位值，后两个表示右下角的定位置；（多边形可以继续增加坐标)  
   // area标签的shape属性的值circle为圆形，圆形coords属性值有三个，前两个表示选取圆形图片的中心定位的值，第三个值表示半径  
  <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">  
  <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">  
  <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">  
</map>  
  
</body>  
</html>