1.<map>定义图像映射，图像映射（image-map）指带有可单击区域的一幅图像。

2.<area>定义图像映射中的区域，area元素永远嵌套在map元素内部，area元素可定义图像中的映射区域。

shape="rect" 是指点击区域的形状矩形，coords="657,15,735,45”，点击区域的四点坐标x1,y1,x2,y2，矩形:(左上角顶点坐标为(x1,y1),右下角顶点坐标为(x2,y2))，href="#" 链接地址。

如：

<map>

<area shape="rect" coords="203,22,377,53" href="1.html">

</map>

图像映射<map>、<area>的更多相关文章

  1. 图像映射map

    <map>标签:带有可点击区域的图像映射 定义一个客户端图像映射.图像映射(image-map)指带有可点击区域的一幅图像. 效果图: 点击相应蓝色标签可进入详情页面浏览. 代码: < ...

  2. HTML <map> 标签－创建带有可点击区域的图像映射

    定义和用法 定义一个客户端图像映射.图像映射(image-map)指带有可点击区域的一幅图像. 所有主流浏览器都支持 <map> 标签. 注释:area 元素永远嵌套在 map 元素内部. ...

  3. HTML <area> 标签 带有可点击区域的图像映射（图像映射指的是带有可点击区域的图像）

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

  4. 带有可点击区域的图像映射：HTML <map> 标签

    实例 带有可点击区域的图像映射: <img src="planets.jpg" border="0" usemap="#planetmap&qu ...

  5. html 图像映射（一个图像多个连接）

    以前就见过那种导航地图,点击地图的不同省份分别跳到不同的连接,现在用html实现一下,简单的. 图像映射是指一个图像可以建立多个连接,就是在图像上面定义多个区域,每个区域连接到不同的地址. 效果如图: ...

  6. html 图像映射

    个人先做而一个例子 <body> <img src="图像映射/enterdesk.com-D69055E2B422567CB273963EA05FF7D4.jpg&quo ...

  7. HTML图像映射

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. 图像热点&图像映射

    图像映射 图像映射也称为图像热点. 作用: 让同一张图片上的不同区域,可以实现多个不同的超链接功能. 图示: <map>图像映射三步走: 图像映射的实现需要三方面配合完成: 1.图像映射容 ...

  9. HTML <img>标签 创建图像映射

    初级前端一枚 下面代码是在图片上创建图像映射 自己整理了下 做个笔记 希望也可以帮助后来学习的朋友! <map name="planetmap"> <area s ...

随机推荐

  1. 【ASP.NET Core分布式项目实战】（一）IdentityServer4登录中心、oauth密码模式identity server4实现

    本博客根据http://video.jessetalk.cn/my/course/5视频整理 资料 OAuth2 流程:http://www.ruanyifeng.com/blog/2014/05/o ...

  2. Zabbix实战-简易教程--通过公众平台企业号发送短信

    一.注册企业号[体验号] 打开页面 http://qydev.weixin.qq.com/try?t=experience   (2016年注册的时候的连接)现在可能变了.进行注册操作,默认有90天的 ...

  3. 大数据学习系列之九---- Hive整合Spark和HBase以及相关测试

    前言 在之前的大数据学习系列之七 ----- Hadoop+Spark+Zookeeper+HBase+Hive集群搭建 中介绍了集群的环境搭建,但是在使用hive进行数据查询的时候会非常的慢,因为h ...

  4. cobaltstrike安装加破解教程+使用教程

    1.先安装java环境= = 1. 下载1.8u121的JAVA JDK (新的java JDK不稳定)!!原因:https://blog.cobaltstrike.com/2017/04/26/ja ...

  5. 基于Windows下python3.4.1IDLE常用快捷键小结

    安装IDLE后鼠标右键点击*.py 文件,可以看到Edit with IDLE 选择这个可以直接打开编辑器.IDLE默认不能显示行号,使用ALT+G 跳到对应行号,在右下角有显示光标所在行.列.ALT ...

  6. Codeforces Round #343 (Div. 2)-629A. Far Relative’s Birthday Cake 629B. Far Relative’s Problem

    A. Far Relative's Birthday Cake time limit per test 1 second memory limit per test 256 megabytes inp ...

  7. hdu_2668 Daydream O(n)求最长不重复子串

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2668 Daydream Time Limit: 2000/1000 MS (Java/Others)  ...

  8. ThinkPHP 下载、导入、导出功能的设计与实现

    下载: 1.引入命名空间: use Org\Net\Http; 2.在入口文件中设置根目录: //定义根目录的绝对地址 define('ROOT',str_replace("\\" ...

  9. [国嵌攻略][070-095][Linux编程函数手册]

    第1类 时间编程类 1.1 获取日历时间 1.1.1 函数名 time 1.1.2 函数原形 time_t time(time_t *t) 1.1.3 函数功能 返回日历时间 1.1.4 所属头文件 ...

  10. Spider_Man_3 の selenium

    一:介绍 selenium最初是一个自动化测试工具,而爬虫中使用它主要是为了解决requests无法直接执行JavaScript代码的问题 selenium本质是通过驱动浏览器,完全模拟浏览器的操作, ...