HTML标签<map>和<area>

HTML <map> 标签##

带有可点击区域的图像映射:定义一个客户端图像映射。图像映射(image-map)指带有可点击区域的一幅图像

实例

     <html>
     <body>

        <p>请点击图像上的星球,把它们放大。</p>

       <img    src="/i/eg_planets.jpg" border="0"  usemap="#planetmap"
alt="Planets" />
       <map name="planetmap" id="planetmap">
           <area  shape="circle"   coords="180,139,14"  href ="/example/html/venus.html"  target ="_blank"  alt="Venus" />
           <area  shape="circle"  coords="129,161,10"  href ="/example/html/mercur.html"  target ="_blank"  alt="Mercury" />
           <area  shape="rect"  coords="0,0,110,260"  href ="/example/html/sun.html"  target ="_blank"  alt="Sun" />
       </map>
</body>
</html>

浏览器支持

1498749283(1).png

提示与注释
注释:area 元素永远嵌套在 map 元素内部。area 元素可定义图像映射中的区域。

注释:<img>中的 usemap 属性可引用 <map> 中的 id 或 name 属性(取决于浏览器),所以我们应同时向 <map> 添加 id 和 name 属性。

必需的属性

必需

可选的属性

可选

HTML <area> 标签##

<area> 标签定义图像映射中的区域(注:图像映射指得是带有可点击区域的图像)。
area 元素总是嵌套在 <map> 标签中。
注释:<img>标签中的 usemap 属性与 map元素 name 属性相关联,创建图像与映射之间的联系。

HTML 与 XHTML 之间的差异
在 HTML 中,<area> 没有结束标签。
在 XHTML 中,<area> 必须正确地关闭。

必需的属性

必需

可选的属性

可选

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 3,517评论 1 41
  • HTML5 标签comment 注释标签用于在源文档中插入注释。注释内容不会被浏览器显示。为代码编写注释的好处是...
    才気莮孒阅读 4,226评论 1 25
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 136,471评论 19 139
  • 学习HTML的最佳网站没有之一http://www.w3school.com.cn/html/ 关于HTML/HT...
    Amyyy_阅读 2,362评论 0 16
  • 1、思想学习的目标:思想上积极向上,关注时事政治,向各位先进的党员同志学习,积极向党组织靠拢 2、专业学习的目标:...
    财管支部尹芳逸阅读 241评论 1 0

友情链接更多精彩内容