`

HTML <map> 标签的使用

    博客分类:
  • HTML
阅读更多

HTML <map> 标签

 

定义和用法

定义一个客户端图像映射。图像映射(image-map)指带有可点击区域的一幅图像。

实例

带有可点击区域的图像映射:

<img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" />

<map name="planetmap" id="planetmap">
  <area shape="circle" coords="180,139,14" href ="venus.html" alt="Venus" />
  <area shape="circle" coords="129,161,10" href ="mercur.html" alt="Mercury" />
  <area shape="rect" coords="0,0,110,260" href ="sun.html" alt="Sun" />
</map>

 

 

浏览器支持

所有主流浏览器都支持 <map> 标签。

HTML 与 XHTML 之间的差异

NONE

提示和注释:

注释:area 元素永远嵌套在 map 元素内部。area 元素可定义图像映射中的区域。

注释:<img>中的 usemap 属性可引用 <map> 中的 id 或 name 属性(取决于浏览器),所以我们应同时向 <map> 添加 id 和 name 属性。

必需的属性

DTD 指示此属性允许在哪种 DTD 中使用。S=Strict, T=Transitional, F=Frameset.

属性 值 描述 DTD
id unique_name 为 map 标签定义唯一的名称。 STF

可选的属性

DTD 指示此属性允许在哪种 DTD 中使用。S=Strict, T=Transitional, F=Frameset.

属性 值 描述 DTD
name mapname 为 image-map 规定的名称。 STF

标准属性

class, title, style, dir, lang, xml:lang

事件属性

tabindex, accesskey, onclick, ondblclick, onmousedown, onmouseup, onmouseover, 
onmousemove, onmouseout, onkeypress, onkeydown, onkeyup, onfocus, onblur

 

分享到:
评论

相关推荐

    Html5中文手册(程序员必备手册)

    51、&lt;map&gt; 定义图像映射。 声明:本电子书内容源于网络,所有内容仅供测试, 不保证内容的正确性! HTML 5中文参考手册 由夏天(博客:www.xiatianhk.com)收集并整理 52、&lt;mark&gt; 定义有记号的文本。 53、&lt;menu&gt; 定义...

    jquery-1.1.3 效率提高800%

    separated attribute (such as a class or rel attribute).&lt;br&gt;&lt;br&gt;$("a[@rel~=test]")Animation Improvements&lt;br&gt;&lt;br&gt;参数: &lt;br&gt;options &lt;br&gt;返回值: &lt;br&gt;XMLHttpRequest &lt;br&gt;使用HTTP请求一个页面。&lt;br&gt;这是jQuery...

    地图定位(jsp、html嵌入地图)

    嵌入jsp里面的地图,左上角的人形可以拖动到可以看的位置就会看到当地的接到和人物。

    嵌入式HTTP服务器NanoHTTPD.zip

     Map&lt;String, List&lt;String&gt;&gt; decodedQueryParameters =  decodeParameters(session.getQueryParameterString());    StringBuilder sb = new StringBuilder();  sb.append("&lt;html&gt;");  sb....

    jQuery完全实例.rar

    &lt;p&gt;one&lt;/p&gt; &lt;div&gt;&lt;p&gt;two&lt;/p&gt;&lt;/div&gt; &lt;p&gt;three&lt;/p&gt; jQuery 代码: $("div &gt; p"); 结果: [ &lt;p&gt;two&lt;/p&gt; ] -------------------------------------------------------------------------------- 在文档的第一个表单...

    html5大作业,mp4

    精彩视频是从网上下载的mp4格式,将之放入文件夹map4下,使用&lt;source&gt;标签定义媒介资源,并且点开页面自动加载运行。站长简介和注册使用了&lt;form&gt;表单。文章分布、趣味游戏使用&lt;script&gt;进行表单验证和动态内容修改。...

    jQuery详细教程

    &lt;p&gt;&lt;a href="#" id="start"&gt;Start Animation&lt;/a&gt;&lt;/p&gt; &lt;div id="box" style="background:#98bf21;height:100px;width:100px;position:relative"&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; jQuery 隐藏和显示 通过 hide() 和 show...

    html map 标签使用

    html map 标签使用

    freemarker总结

    其它的运行符可以作用于数字和日期,但不能作用于字符串,大部分的时候,使用gt等字母运算符代替&gt;会有更好的效果,因为 FreeMarker会把&gt;解释成FTL标签的结束字符,当然,也可以使用括号来避免这种情况,如:&lt;#if (x&gt;y)&gt; ...

    FreeMark学习笔记

    1,开始标签:&lt;#directivename parameter&gt; 2,结束标签:&lt;/#directivename&gt; 3,空标签:&lt;#directivename parameter/&gt; 实际上,使用标签时前面的符号#也可能变成@,如果该指令是一个用户指令而不是系统内建指令时,应将#符号...

    html的一些面试题.pdf

    9. `&lt;link&gt;`和`&lt;script&gt;`标签分别用来做什么? 10. 行内元素和块级元素的区别是什么? 11. HTML5中的表单元素有哪些新变化? 12. 什么是图像地图(image map)? 13. HTML注释的语法是什么? 14. iframe是什么,主要...

    JavaExcel读写库JxlExcel.zip

    &lt;/templates&gt;模板(template)template元素用于定义一个模板,包含一个属性name,用于唯一标识该模板标题行(tittleRow)使用titleRow可以定义多行标题,每行标题又包含多个标题列(titleCol),标题列可以像html ...

    struts2 标签库 帮助文档

    1. &lt;s:generator separator="" val=""&gt;&lt;/s:generator&gt;----和&lt;s:iterator&gt;标签一起使用 H: 1. &lt;s:head/&gt;-----在&lt;head&gt;&lt;/head&gt;里使用,表示头文件结束 2. &lt;s:hidden&gt;&lt;/s:hidden&gt;-----隐藏值 I: 1. &lt;s:...

    详解 html area标签

    area 元素总是嵌套在 &lt;map&gt; 标签中。本文重点给大家介绍html area标签的相关知识,需要的朋友参考下吧

    html图像地图map标签的使用

    map标签定义一个客户端图像映射,图像映射(image-map)指带有可点击区域的一幅图像。这是在所有主流浏览器中都可以兼容的一个标签属性。

    JSP实现用于自动生成表单标签html代码的自定义表单标签

    本文实例讲述了JSP实现用于自动生成表单标签html代码的自定义表单标签。...Map&lt;String&gt; map = new HashMap&lt;String&gt;(); map.put(2, 选项二); map.put(3, 选项三); map.put(4, 选项四); map.put(5, 选

    Html image 标签 配合 map使用

    NULL 博文链接:https://zongyukai20070419095606.iteye.com/blog/603698

    cms后台管理

    protected List&lt;Content&gt; getList(Map&lt;String, TemplateModel&gt; params, Environment env) throws TemplateException { Integer[] ids = DirectiveUtils.getIntArray(PARAM_IDS, params); if (ids != null) { //...

    jfinalpluginsjfinal-dreampie.zip

     public Map&lt;String, AuthzHandler&gt; getJdbcAuthz(); } 13.shiro的freemarker标签库 &lt;@shiro.hasPermission name="P_USER"&gt;  &lt;li&gt;&lt;a href="/admin/user"&gt;${i18n.getText("admin.user")}&lt;/a&gt;&lt;/li&gt;  ...

    mapstruct-1.2.0.Final-API文档-中文版.zip

    标签:mapstruct、中文文档、jar包、java; 使用方法:解压翻译后的API文档,用浏览器打开“index.html”文件,即可纵览文档内容。 人性化翻译,文档中的代码和结构保持不变,注释和说明精准翻译,请放心使用。

Global site tag (gtag.js) - Google Analytics