<img src="data:images/02.gif" title="flower" usemap="#mm" />
<map name="mm" id="mm">
<area shape="circle" coords="50,50,20" href="http://www.baidu.com/" />
<area shape="rect" coords="50,50,100,120" href="http://www.baidu.com/" />
<area shape="poligon" coords="50,80,70,20,30,50" href="http://www.baidu.com/" />
</map>

shape和coords:是两个主要的参数,用于设定热点的形状和大小。其基本用法如下:

<area shape="rect" coords="x1, y1,x2,y2" href=url>表示设定热点的形状为矩形,左上角顶点坐标为(X1,y1),右下角顶点坐标为(X2,y2)。

<area shape="circle" coords="x1, y1,r" href=url>表示设定热点的形状为圆形,圆心坐标为(X1,y1),半径为r。

<area shape="poligon" coords="x1, y1,x2,y2 ......" href=url>表示设定热点的形状为多边形,各顶点坐标依次为(X1,y1)、(X2,y2)、(x3,y3)........

area标签circle/rect/poligon坐标的更多相关文章

  1. <area> 标签

    定义和用法 <area> 标签定义图像映射中的区域(注:图像映射指得是带有可点击区域的图像). area 元素总是嵌套在 <map> 标签中. 注释:<img> 标 ...

  2. map,area标签

    map,area标签 <img src ="planets.gif" alt="Planets" usemap ="#planetmap&quo ...

  3. html area标签详解

    <area> 标签定义图像映射中的区域(注:图像映射指得是带有可点击区域的图像). area 元素总是嵌套在 <map> 标签中. 注:<img> 标签中的 use ...

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

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

  5. HTML图片热区 map area 标签

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

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

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

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

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

  8. map+area标签

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

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

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

随机推荐

  1. iOS富文本(二)初识Text Kit

    概述 Text Kit 是建立在Core Text上的文本布局系统,虽然没有Core Text那么强大的文本处理功能,但是对于大多数常见的文本布局用Text Kit能够很简单的实现,而不是用Core ...

  2. 堆Heap

    #pragma once#include <vector> // 小堆template<class T>  //仿函数struct Less{       bool opera ...

  3. python - 简明 性能测试

    简洁测试: # python -m cProfile test.py 代码注入: # -*- coding: utf-8 -*- class test(object): pass class test ...

  4. MAC自动备份数据到服务器

    需求:公司内部使用自己电脑,回家需要使用另一台电脑,所以想时时备份公司用的电脑中文件.代码到服务器上,回家就可以用啦 1 无密码使用scp (1)第一步:生成密匙对,我用的是rsa的密钥.使用命令 & ...

  5. UVA 11796 - Dog Distance

    题意  两条狗啊,同时跑,,同时结束,各自跑各自的道路,问跑的过程中,他们最大距离和最小距离的差: 方法  恶心一点就是,最大最小距离的求解方法,假设两只狗都只有一条线段要跑,则可以判定在端点处有最大 ...

  6. Java多线程-工具篇-BlockingQueue

    前言: 在新增的Concurrent包中,BlockingQueue很好的解决了多线程中,如何高效安全“传输”数据的问题.通过这些高效并且线程安全的队列 类,为我们快速搭建高质量的多线程程序带来极大的 ...

  7. Comparator与Comparable的异同

    同 它们都是Java的一个接口,都是用来实现集合中元素的比较.排序. 异 Comparator位于java.util下: Comparable位于java.lang下: Comparable(可比较的 ...

  8. Java中Enum枚举的使用

    三种不同的用法 注意项: 1.在switch中使用枚举能使代码的可读性更强.   2.如果要自定义方法,那么必须在enum实例序列的最后添加分号.而且Java要求必须先定义enum实例.   3.所有 ...

  9. 因為 Hypervisor 未執行,所以無法啟動虛擬機器

    bcdedit /set hypervisorlaunchtype auto https://technet.microsoft.com/zh-tw/magazine/2009.02.hyperv.a ...

  10. PHP 代码质量检测工具的安装与使用

    代码统计工具 PHPLOC安装:wget https://phar.phpunit.de/phploc.phar chmod +x phploc.phar sudo mv phploc.phar /u ...