html map标签是什么?html map标签的结构及具体使用方法详解


当前第2页 返回上一页

1

2

3

4

5

6

7

8

9

10

11

<div class="map_img">

    <img class="mapImg" usemap="mapName" src="isphoto/abc.png" alt="" style="width: 450px">

    <map name="mapName">

         <area shape="circle" coords="633,276,28" target="_blank" href ="javascript:alert('汽车图标');" alt=""/>

     </map>

    <!-- 一张图片对应一个name和usemap -->

    <img class="mapImg" usemap="mapName2" src="isphoto/abc.png" alt="" style="width: 450px">

     <map name="mapName2">

         <area shape="circle" coords="633,276,28" target="_blank" href ="javascript:alert('第二张图的汽车图标');" alt=""/>

     </map>

</div>

html<map>标签常用在为图像的某区域添加超链接!

用法如下:

1

2

3

4

5

6

<img src ="planets.gif" alt="无法显示此图像" usemap ="#planetmap" />

<map id ="planetmap" name="planetmap">

<area shape ="rect" coords ="0,0,82,126" href ="sun.htm" alt="Sun" />

<area shape ="circle" coords ="90,58,3" href ="mercur.htm" alt="Mercury" />

<area shape ="circle" coords ="124,58,8" href ="venus.htm" alt="Venus" />

</map>

usemap属性获取<map>标签信息,<area> 标签定义一个链接区域,shape属性定义区域形状,coords属性定义链接区域的起点坐标和终点坐标

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

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

【相关推荐】

标签是什么意思?HTML5标签的基本用法详解">HTML5<progress>标签是什么意思?HTML5<progress>标签的基本用法详解

html textarea是什么意思?如何获取textarea标签中的换行符和空格?

以上就是html map标签是什么?html map标签的结构及具体使用方法详解的详细内容,更多文章请关注木庄网络博客

返回前面的内容

相关阅读 >>

浅谈Html中scr与href是什么?scr与href有什么区别?

Html表单怎么插图

关于Html基本语法和语义写法规则与实例分析

Html的<label> 标签

Html除br外如何换行

Html行高怎么设置

Html的标记文字详解

Html blockquote怎么用?blockquote标签的用法介绍

Html dir标签怎么用

Html中关于元素居中有哪些需要注意的事项

更多相关阅读请进入《Html》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...