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. 升级node与npm

    升级node 原文地址:https://lierabbit.cn/articles/3 一.安装 n 工具,这个工具的名称很短,方便输入 npm install -g n 二.升级node至长期版或者 ...

  2. 开源API测试工具 Hitchhiker v0.8 - 自动化测试结果统计

    Hitchhiker 是一款开源的支持多人协作的 Restful Api 测试工具,支持自动化测试, 数据对比,压力测试,支持脚本定制请求,可以轻松部署到本地,和你的team成员一起协作测试Api. ...

  3. 【Spring】DispatcherServlet源码分析

    使用过HttpServlet的都应该用过其doGet和doPost方法,接下来看看DispatcherServlet对这两个方法的实现(源码在DispatcherServlet的父类Framework ...

  4. FPGA学习之路——一路走来

    既然选择了远方,便不顾风雨兼程,一路走下去. —韩彬 在看bingo的书时,看到这样写到.做什么事情都不容易,学习也是,所以一个词很重要不忘初心.作为一名大二的学生,我很高兴能够将自己学习FPGA的过 ...

  5. Erlang/OTP设计原则（文档翻译）

    http://erlang.org/doc/design_principles/des_princ.html 图和代码皆源自以上链接中Erlang官方文档,翻译时的版本为20.1. 这个设计原则,其实 ...

  6. 线程池内的异步线程创建UI控件，造成UI线程卡死无响应的问题分析

    winform应用在使用一段时间后,切换到其他系统或者打开word.excel文档,再切换回winform应用时,系统有时出现不响应的现象.有时在锁屏后恢复桌面及应用时也发生此问题. 经微软支持确认, ...

  7. Centos搭建Docker环境

    安装Docker 安装Docker Docker 软件包已经包括在默认的 CentOS-Extras 软件源里.因此想要安装 docker,只需要运行下面的 yum 命令: yum install d ...

  8. spring mvc的跨域解决方案

    什么是跨域 一句话:同一个ip.同一个网络协议.同一个端口,三者都满足就是同一个域,否则就是跨域. 为什么非得跨域 基于两个方面: a. web应用本身是部署在不同的服务器上 b.基于开发的角度 -- ...

  9. Python3——让我们像孩子一样的去看书

    用tkinter来画高级图形 让我们一起创造一个按钮吧!"按住我:0  :" 那我们先做一个小例子,让我们第一眼先认识到这个它(tkinter)吧! 输入以下代码: from tk ...

  10. BZOJ1226: [SDOI2009]学校食堂Dining

    题目:http://www.lydsy.com/JudgeOnline/problem.php?id=1226 状压dp. f[i][s][k]表示原顺序中前i-1个人都吃了饭,当前状态为s(i及i之 ...