怎么制作图片区域热点链接?有哪些样式?-HTML小实例

济南云服务器 2023年2月28日06:06:34HTML教程怎么制作图片区域热点链接?有哪些样式?-HTML小实例已关闭评论1611阅读模式

怎么制作图片区域热点链接?有哪些样式?日常浏览网站页面时,我们会遇到某些网站页面中的图片点击不同的区域会跳转到一个新页面的效果,如果,我们在开发某个页面时也遇到类似的需求,该如何实现呢?接下来,济南云服务器小编就来和大家一起详细看看相关内容

关键代码:

 <head>

  <title>图片热点</title>
 </head>

 <body >

<img src="./images/济南网站建设.jgp" usemap="#seo"/>
<map name="seo">

<area shape="rect" coords="66,66,100,100" href="http://news.hcsw666.com/" target="_blank">



</map>>
 
 </body>

一、通过shape定义图片热点区域形状:

1、rect:矩形
2、circ:圆形
3、poly:多边形

二、coords与shape一起搭配使用,定位图片热点区域坐标。

三、href定义一个目标链接地址。

济南云服务器
  • 本文由 发表于 2023年2月28日06:06:34
  • 转载请务必保留本文链接:http://news.hcsw666.com/553