# html5   image>usemap  (attribute)

https://caniuse.com/#search=usemap

http://www.w3.org/TR/html5/embedded-content-0.html#image-maps-0

4.7.1.1.12 Image maps

If an img element has a usemap attribute which references a map element containing area elements that have href attributes, the img is considered to be interactive content. In such cases, always provide a text alternative for the image using the alt attribute.

Consider the following image which is a map of Katoomba, it has 2 interactive regions corresponding to the areas of North and South Katoomba:

The text alternative is a brief description of the image. The alt attribute on each of the area elements provides text describing the content of the target page of each linked region:

<p>View houses for sale in North Katoomba or South Katoomba:</p>
<p><img src="data:imagemap.png" width="209" alt="Map of Katoomba" height="249" usemap="#Map"> <map name="Map">
<area shape="poly" coords="78,124,124,10,189,29,173,93,168,132,136,151,110,130"
href="north.html" alt="Houses in North Katoomba">
<area shape="poly" coords="66,63,80,135,106,138,137,154,167,137,175,133,144,240,49,223,17,137,17,61"
alt="Houses in South Katoomba" href="south.html">
</map>


html5 image>usemap (attribute)的更多相关文章

  1. html5 & input & accept attribute

    html5 & input & accept attribute html input accept attribute https://www.w3schools.com/TAGS/ ...

  2. JSF使用HTML5的custom attribute

    只需要在页面引用这样的命名空间: xmlns:pt="http://xmlns.jcp.org/jsf/passthrough"之后,在JSF的控件的html5属性加上前缀&quo ...

  3. HTML5 Differences from HTML4

    Abstract "HTML5 Differences from HTML4" describes the differences of the HTML5 specificati ...

  4. 【转】39个让你受益的HTML5教程

    闲话少说,本文作者为大家收集了网上学习HTML5的资源,期望它们可以帮助大家更好地学习HTML5. 好人啊! 不过,作者原来说的40个只有39个,因为第5个和第8个是重复的. 原文在此! 1. 五分钟 ...

  5. 39个让你受益的HTML5教程

    1. 五分钟入门HTML5 (Learn HTML5 in 5 Minutes!) By Jennifer Marsman 毫无疑问,HTML5是一个热门话题.如果你需要一个迅速了解HTML基础的速成 ...

  6. html5手机常见问题与工具分享

    mobileTech A useful tools or tips list for mobile web application developing 这个项目收集移动端开发所需要的一些资源与小技巧 ...

  7. 【HTML5 1】39个让你受益的HTML5教程

    闲话少说,本文作者为大家收集了网上学习HTML5的资源,期望它们能够帮助大家更好地学习HTML5. 好人啊! 只是,作者原来说的40个仅仅有39个,由于第5个和第8个是反复的. 原文在此! 1. 五分 ...

  8. 39一个可以让你受益HTML5课程

    事不宜迟,本文作者是我们收集的在线学习HTML5资源.我们希望他们能够帮助你更好地学习HTML5. 不错啊! 只,说原作者40一个只有39一.由于第一5钍和8一是重复. 原文在此! 1. 五分钟入门H ...

  9. HTML5 placeholder(空白提示) 属性

    原文地址:HTML5′s placeholder Attribute 演示地址: placeholder演示 原文日期: 2010年08月09日 翻译日期: 2013年8月6日 浏览器引入了许多的HT ...

随机推荐

  1. XV6学习(1) Lab util

    正在学习MIT的6.S081,把做的实验写一写吧. 实验的代码放在了Github上. 第一个实验是Lab util,算是一个热身的实验,没有涉及到系统的底层,就是使用系统调用来完成几个用户模式的小程序 ...

  2. jQuery 选项卡切换过渡效果

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

  3. Bitter.Core系列七:Bitter ORM NETCORE ORM 全网最粗暴简单易用高性能的 NETCore ORM 示例 更新删除插入

    Bitter Orm 在操作数据库增删改的时候,支持模型驱动和直接执行裸SQL 操作,示例代码如下: 一:模型驱动(增删改) /// <summary> /// 插入,删除,更新示例(模型 ...

  4. 列出HBASE所有表的相关信息,如表名、创建时间等。

    import java.io.IOException; import java.util.Collection; import java.util.Iterator; import org.apach ...

  5. p2p nat 穿透原理

    nat 打洞穿透原理,需要服务端. 假设有A.B两个客户端和S一个服务器 Step 1 : A.B发送UDP请求给S,S知道了A.B在公网的IP和端口. Step 2: A从S中取B在公网的IP和端口 ...

  6. loj10153二叉苹果树

    有一棵二叉苹果树,如果数字有分叉,一定是分两叉,即没有只有一个儿子的节点.这棵树共 N 个节点,标号 1 至 N,树根编号一定为 1. 我们用一根树枝两端连接的节点编号描述一根树枝的位置.一棵有四根树 ...

  7. Vue3.0短视频+直播|vue3+vite2+vant3仿抖音界面|vue3.x小视频实例

    基于vue3.0构建移动端仿抖音/快手短视频+直播实战项目Vue3-DouYin. 5G时代已来,短视频也越来越成为新一代年轻人的娱乐方式,在这个特殊之年,又将再一次成为新年俗! 基于vue3.x+v ...

  8. Docker是如何实现隔离的

    Docker是如何实现隔离的 2.进程的隔离 4.文件的隔离 5.资源的限制 7.与传统虚拟机技术的区别 原文地址: 微信公众号:<鲁智深菜园子>:Docker是如何实现隔离的 # 1.运 ...

  9. SparkMLlib—协同过滤之交替最小二乘法ALS原理与实践

    SparkMLlib-协同过滤之交替最小二乘法ALS原理与实践 一.Spark MLlib算法实现 1.1 显示反馈 1.1.1 基于RDD 1.1.2 基于DataFrame 1.2 隐式反馈 二. ...

  10. MIT 6.S081 聊聊xv6中的文件系统(上)

    前言 Lab一做一晚上,blog一写能写两天,比做Lab的时间还长( 这篇博文是半夜才写完的,本来打算写完后立刻发出来,但由于今天发现白天发博点击量会高点,就睡了一觉后才发(几十的点击量也是点击量啊T ...