map,area标签

<img src ="planets.gif" alt="Planets" usemap ="#planetmap" />
<map name="planetmap">
<area shape="rect" coords="0,0,110,260" href="sun.htm" alt="Sun" />
<area shape="circle" coords="129,161,10" href="mercur.htm" alt="Mercury" />
<area shape="circle" coords="180,139,14" href="venus.htm" alt="Venus" />
</map>

a、shape 属性:

描述
default 规定全部区域。
rect 定义矩形区域。
circ 定义圆形。
poly 定义多边形区域。

(建议使用缩写,最后写default)

  b、coords 属性:

  圆形:shape="circle",coords="x,y,z"

  这里的 x 和 y 定义了圆心的位置("0,0" 是图像左上角的坐标),r 是以像素为单位的圆形半径。

  多边形:shape="polygon",coords="x1,y1,x2,y2,x3,y3,..."

  每一对 "x,y" 坐标都定义了多边形的一个顶点("0,0" 是图像左上角的坐标)。定义三角形至少需要三组坐标;高纬多边形则需要更多数量的顶点。

多边形会自动封闭,因此在列表的结尾不需要重复第一个坐标来闭合整个区域。

  矩形:shape="rectangle",coords="x1,y1,x2,y2"

  第一个坐标是矩形的一个角的顶点坐标,另一对坐标是对角的顶点坐标,"0,0" 是图像左上角的坐标。请注意,定义矩形实际上是定义带有四个顶点的多边形的一种简化方法。(如果某个 area 标签中的坐标和其他区域发生了重叠,会优先采用最先出现的 area 标签。浏览器会忽略超过图像边界范围之外的坐标)

  c、nohref 属性规定该区域没有相关的链接:  nohref="nohref"

map,area标签的更多相关文章

  1. map+area标签

    map标签是用于定义一个客户端的图像映射即带有可点击区域的一幅图像,配合area标签 area 元素永远嵌套在 map 元素内部.area 元素可定义图像映射中的区域 例:要实现一幅地图上鼠标点击或者 ...

  2. HTML图片热区 map area 标签

    实例 <img src ="planets.gif" alt="Planets" usemap ="#planetmap" /> ...

  3. 详细解读html中的Map,area标签

    一.定义 定义一个客户端图像映射.图像映射(image-map)指带有可点击区域的一幅图像. 二.使用 <!--定义一个图像 他的边框为0(border) usemap(指定该图像被用作图像地图 ...

  4. map area 标签的使用

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  5. HTML <area> 标签 带有可点击区域的图像映射(图像映射指的是带有可点击区域的图像)

    例子: <img src="planets.gif" width="145" height="126" alt="Plane ...

  6. HTML中的map和area标签

    1. 标签介绍: (1)map标签: 该标签是指图片的映射,也就是说一张可以点击的图片的映射: 属性介绍: <1> id: <img>中的 usemap 属性可引用 <m ...

  7. html中map标签和area标签的应用

    map标签的用途:是与img标签绑定使用的,常被用来赋予给客户端图像某处区域特殊的含义,点击该区域可跳转到新的文档. 因为map标签是与img标签绑定使用的,所以我们需要给map标签添加ID和name ...

  8. html中map标签和area标签的应用(总结)

    html中map标签和area标签的应用(总结) 一.总结 一句话总结: html中map标签和area标签和组成图片地图,在前端优化中可以减少http请求 1.map标签的用途是什么? 图片地图:是 ...

  9. HTML <area> 标签区域map标签

    1.距形:(左上角顶点坐标为(x1,y1),右下角顶点坐标为(x2,y2)) <area shape="rect" coords="x1,y1,x2,y2" ...

随机推荐

  1. JavaSE复习日记 : 循环语句(for/while/do while)

    /* * 循环语句(for循环,while和do while循环) */ /* * for循环语句 * * for循环语法: * for (表达式1;表达式2;表达式3 ){ * java语句 * } ...

  2. BZOJ 2440 完全平方数(莫比乌斯反演+二分查找)

    题目链接:http://acm.hust.edu.cn/vjudge/problem/viewProblem.action?id=23362 题意:定义含有平方数因子的数为完全平方数(平方数因子不包含 ...

  3. BestCoder Round #38

    1001 Four Inages Strategy 题意:给定空间的四个点,判断这四个点是否能形成正方形 思路:判断空间上4个点是否形成一个正方形方法有很多,这里给出一种方法,在p2,p3,p4中枚举 ...

  4. [C#绘图]Matrix类

    想要从入门到精通一门语言,最好的学习文档就是官方提供的文档,比如说OpenCV的学习,最权威的学习资料还是其官方的学习文档,C#和.net的最好的学习入门文档还是MSDN.但是好多人一开始真的不会用, ...

  5. 我用过的linux命令--安装JDK

    首先,我的测试环境是CentOS的linux虚拟机,如果想安装JDK,首先要有一个JDK.利用的软件就是WinSCP,把JDK从windows中传送到Linux中去. 1. JDK从Windows到L ...

  6. .net 更改时间格式

    /// <summary> /// 更改时间格式[HH:mm:ss]到[HHmmss] /// </summary> /// <param name="inpu ...

  7. C# 读书笔记之访问关键字this和base

    this 关键字引用类的当前实例.静态成员方法中不能使用this关键字,this关键字只能在实例构造函数.实例方法或实例访问器中使用. base 关键字用于从派生类中访问基类的成员. 指定创建派生类实 ...

  8. 如何给变量取个简短且无歧义的名字(转) good

    湾区日报上分享的一篇文章,文章的作者在Google设计Dart语言,就变量命名方面给了4点建议,文中也列出了好变量名.坏变量名的对比.不管作者的看法与你实际中的命名习惯是否一致,看完这篇文章,相信可以 ...

  9. ALV列、行、单元格颜色设置

    )颜色含义 :海蓝:2:浅清:3:黄色:4:浅蓝:5:青色:6:红色:7:橙色. (1)首位为主颜色: (2)次位为辅助颜色: (3)末位为0时,表示首位数字表为表格的底色: 末位为1时,则表示以1为 ...

  10. Flex 内置验证器—验证用户输入

    今晚对于Flex中的Validator类(所有验证器的父类)测试一下 ---->其中常用的验证类有StringValidator,NumberValidator,DateValidator 测试 ...