开发手册HTMLCSSJavaScript
HTML手册HTMLXHTMLHTML 5HTML相关标签列表(字母排序)标签列表(功能排序)HTML 属性HTML 事件HTML 视频/音频HTML 画布HTML 文档类型HTML 颜色名HTML 字符集HTML ASCIIHTML ISO-8859-1HTML 符号HTML URL 编码HTML 语言代码HTTP 消息HTTP 方法<!--><!DOCTYPE><a><abbr><acronym><address><applet><area><article><aside><audio><b><base><basefont><bdi><bdo><big><blockquote><body><br><button><canvas><caption><center><cite><code><col><colgroup><command><datalist><dd><del><details><dfn><dialog><dir><div><dl><dt><em><embed><fieldset><figcaption><figure><font><footer><form><frame><frameset><h1> - <h6><head><header><hr><html><i><iframe><img><input><ins><kbd><keygen><label><legend><li><link><main><map><mark><menu><menuitem><meta><meter><nav><noframes><noscript><object><ol><optgroup><option><output><p><param><pre><progress><q><rp><rt><ruby><s><samp><script><section><select><small><source><span><strike><strong><style><sub><summary><sup><table><tbody><td><textarea><tfoot><th><thead><time><title><tr><track><tt><u><ul><var><video><wbr>HTML 元信息基本的 HTML 标签HTML 教程延伸阅读:改变文本的外观和含义HTML 样式Web 品质 - 重要的 HTML 元素HTML <a> 标签的 charset 属性HTML <a> 标签的 coords 属性HTML <a> download 属性HTML <a> 标签的 href 属性HTML <a> 标签的 hreflang 属性HTML 5 <a> 标签的 media 属性HTML <a> 标签的 name 属性HTML <a> 标签的 rel 属性HTML <a> 标签的 rev 属性HTML <a> 标签的 shape 属性HTML <a> 标签的 target 属性HTML <a> type 属性HTML <area> 标签的 alt 属性HTML <area> 标签的 coords 属性HTML <area> 标签的 href 属性HTML <area> 标签的 nohref 属性HTML <area> 标签的 shape 属性HTML <area> 标签的 target 属性HTML <audio> autoplay 属性HTML <audio> controls 属性HTML <audio> loop 属性HTML <audio> muted 属性HTML <audio> preload 属性HTML <audio> src 属性HTML <base> 标签的 href 属性HTML <base> 标签的 target 属性HTML <basefont> 标签的 color 属性HTML <basefont> 标签的 face 属性HTML <basefont> 标签的 size 属性HTML <blockquote> cite 属性HTML <body> 标签的 alink 属性HTML <body> 标签的 background 属性HTML <body> 标签的 bgcolor 属性HTML <body> 标签的 link 属性HTML <body> 标签的 text 属性HTML <body> 标签的 vlink 属性HTML 5 <button> autofocus 属性HTML <button> 标签的 disabled 属性HTML 5 <button> form 属性HTML 5 <button> formaction 属性HTML 5 <button> formenctype 属性HTML 5 <button> formmethod 属性HTML 5 <button> formnovalidate 属性HTML 5 <button> formtarget 属性HTML <button> 标签的 name 属性HTML <button> 标签的 type 属性HTML <button> 标签的 value 属性HTML <canvas> height 属性HTML <canvas> width 属性HTML <caption> 标签的 align 属性HTML <col> 标签的 align 属性HTML <col> 标签的 char 属性HTML <col> 标签的 charoff 属性HTML <col> 标签的 span 属性HTML <col> 标签的 valign 属性HTML <col> 标签的 width 属性HTML <colgroup> 标签的 align 属性HTML <colgroup> 标签的 char 属性HTML <colgroup> 标签的 charoff 属性HTML <colgroup> 标签的 span 属性HTML <colgroup> 标签的 valign 属性HTML <colgroup> 标签的 width 属性HTML <command> checked 属性HTML <command> disabled 属性HTML <command> icon 属性HTML <command> label 属性HTML <command> radiogroup 属性HTML <command> type 属性HTML <del> 标签的 cite 属性HTML <del> 标签的 datetime 属性HTML <details> open 属性HTML <dir> 标签的 compact 属性HTML <div> 标签的 align 属性HTML 5 <embed> height 属性HTML 5 <embed> src 属性HTML 5 <embed> type 属性HTML 5 <embed> width 属性HTML 5 <fieldset> disabled 属性HTML 5 <fieldset> form 属性HTML 5 <fieldset> name 属性HTML <font> 标签的 color 属性HTML <font> 标签的 face 属性HTML <font> 标签的 size 属性HTML <form> accept-charset 属性HTML <form> 标签的 action 属性HTML 5 <form> autocomplete 属性HTML <form> 标签的 enctype 属性HTML <form> 标签的 method 属性HTML <form> 标签的 name 属性HTML 5 <form> novalidate 属性HTML <form> 标签的 target 属性HTML <frame> 标签的 frameborder 属性HTML <frame> 标签的 longdesc 属性HTML <frame> 标签的 marginheight 属性HTML <frame> 标签的 marginwidth 属性HTML <frame> 标签的 name 属性HTML <frame> 标签的 noresize 属性HTML <frame> 标签的 scrolling 属性HTML <frame> 标签的 src 属性HTML contenteditable 属性HTML contextmenu 属性HTML data-* 属性HTML draggable 属性HTML dropzone 属性HTML hidden 属性HTML spellcheck 属性HTML translate 属性HTML <h1> - <h6> 标签的 align 属性HTML <hr> 标签的 align 属性HTML <hr> 标签的 noshade 属性HTML <hr> 标签的 size 属性HTML <hr> 标签的 width 属性HTML <iframe> 标签的 align 属性HTML <iframe> 标签的 frameborder 属性HTML <iframe> 标签的 height 属性HTML <iframe> 标签的 longdesc 属性HTML <iframe> 标签的 marginheight 属性HTML <iframe> 标签的 marginwidth 属性HTML <iframe> 标签的 name 属性HTML <iframe> 标签的 sandbox 属性HTML <iframe> 标签的 scrolling 属性HTML <iframe> 标签的 seamless 属性HTML <iframe> 标签的 src 属性HTML <iframe> 标签的 srcdoc 属性HTML <iframe> 标签的 width 属性HTML <img> 标签的 align 属性HTML <img> 标签的 alt 属性HTML <img> 标签的 border 属性HTML <img> 标签的 height 和 width 属性HTML <img> 标签的 hspace 和 vspace 属性HTML <img> 标签的 ismap 属性HTML <img> 标签的 longdesc 属性HTML <img> 标签的 src 属性HTML <img> 标签的 usemap 属性HTML <input> 标签的 accept 属性HTML <input> 标签的 align 属性HTML <input> 标签的 alt 属性HTML <input> autocomplete 属性HTML 5 <input> autofocus 属性HTML <input> 标签的 checked 属性HTML <input> 标签的 disabled 属性HTML 5 <input> form 属性HTML 5 <input> formaction 属性HTML 5 <input> formenctype 属性HTML 5 <input> formmethod 属性HTML 5 <input> formnovalidate 属性HTML 5 <input> formtarget 属性HTML 5 <input> height 属性HTML 5 <input> list 属性HTML 5 <input> max 属性HTML <input> 标签的 maxlength 属性HTML 5 <input> min 属性HTML 5 <input> multiple 属性HTML <input> 标签的 name 属性HTML 5 <input> pattern 属性HTML 5 <input> placeholder 属性HTML <input> 标签的 readonly 属性HTML 5 <input> required 属性HTML <input> 标签的 size 属性HTML <input> 标签的 src 属性HTML 5 <input> step 属性HTML <input> 标签的 type 属性HTML <input> 标签的 value 属性HTML 5 <input> width 属性HTML <ins> 标签的 cite 属性HTML <ins> 标签的 datetime 属性HTML <keygen> autofocus 属性HTML <keygen> disabled 属性HTML <keygen> form 属性HTML <keygen> keytype 属性HTML <keygen> name 属性HTML <label> 标签的 for 属性HTML 5 <label> form 属性HTML <legend> 标签的 align 属性HTML <li> 标签的 type 属性HTML <li> 标签的 value 属性HTML <link> 标签的 charset 属性HTML <link> 标签的 href 属性HTML <link> 标签的 hreflang 属性HTML <link> 标签的 media 属性HTML <link> 标签的 rel 属性HTML <link> 标签的 rev 属性HTML 5 <link> sizes 属性HTML <link> 标签的 target 属性HTML <link> 标签的 type 属性HTML <map> 标签的 name 属性HTML <menu> label 属性HTML <menu> type 属性HTML <meter> form 属性HTML <meter> high 属性HTML <meter> low 属性HTML <meter> max 属性HTML <meter> min 属性HTML <meter> optimum 属性HTML <meter> value 属性HTML 5 <object> form 属性HTML <ol> 标签的 compact 属性HTML 5 <ol> reversed 属性HTML <ol> 标签的 start 属性HTML <ol> 标签的 type 属性HTML <optgroup> 标签的 disabled 属性HTML <optgroup> 标签的 label 属性HTML <option> 标签的 disabled 属性HTML <option> 标签的 label 属性HTML <option> 标签的 selected 属性HTML <option> 标签的 value 属性HTML <output> 标签的 for 属性HTML <output> 标签的 form 属性HTML <output> 标签的 name 属性HTML <p> 标签的 align 属性HTML <menu> max 属性HTML <menu> value 属性HTML <q> cite 属性HTML 5 <script> async 属性HTML <script> 标签的 charset 属性HTML <script> 标签的 defer 属性HTML <script> 标签的 src 属性HTML <script> 标签的 type 属性HTML <select> 标签的 autofocus 属性HTML <select> 标签的 disabled 属性HTML <select> 标签的 form 属性HTML <select> 标签的 multiple 属性HTML <select> 标签的 name 属性HTML <select> 标签的 required 属性HTML <select> 标签的 size 属性HTML <source> media 属性HTML <source> src 属性HTML <source> type 属性HTML accesskey 属性HTML class 属性HTML dir 属性HTML id 属性HTML lang 属性HTML style 属性HTML tabindex 属性HTML title 属性HTML <style> 标签的 media 属性HTML <style> 标签的 type 属性HTML <table> 标签的 align 属性HTML <table> 标签的 bgcolor 属性HTML <table> 标签的 border 属性HTML <table> 标签的 cellpadding 属性HTML <table> 标签的 cellspacing 属性HTML <table> 标签的 frame 属性HTML <table> 标签的 rules 属性HTML <table> 标签的 summary 属性HTML <table> 标签的 width 属性HTML <tbody> 标签的 align 属性HTML <tbody> 标签的 char 属性HTML <tbody> 标签的 charoff 属性HTML <tbody> 标签的 valign 属性HTML <td> 标签的 abbr 属性HTML <td> 标签的 align 属性HTML <td> 标签的 axis 属性HTML <td> 标签的 bgcolor 属性HTML <td> 标签的 char 属性HTML <td> 标签的 charoff 属性HTML <td> 标签的 colspan 属性HTML <td> 标签的 headers 属性HTML <td> 标签的 height 属性HTML <td> 标签的 nowrap 属性HTML <td> 标签的 rowspan 属性HTML <td> 标签的 scope 属性HTML <td> 标签的 valign 属性HTML <td> 标签的 width 属性HTML <textarea> 标签的 autofocus 属性HTML <textarea> 标签的 cols 属性HTML <textarea> 标签的 disabled 属性HTML <textarea> 标签的 form 属性HTML <textarea> 标签的 maxlength 属性HTML <textarea> 标签的 name 属性HTML <textarea> 标签的 placeholder 属性HTML <textarea> 标签的 readonly 属性HTML <textarea> 标签的 required 属性HTML <textarea> 标签的 rows 属性HTML <textarea> 标签的 wrap 属性HTML <tfoot> 标签的 align 属性HTML <tfoot> 标签的 char 属性HTML <tfoot> 标签的 charoff 属性HTML <tfoot> 标签的 valign 属性HTML <th> 标签的 abbr 属性HTML <th> 标签的 align 属性HTML <th> 标签的 axis 属性HTML <th> 标签的 bgcolor 属性HTML <th> 标签的 char 属性HTML <th> 标签的 charoff 属性HTML <th> 标签的 colspan 属性HTML <th> 标签的 headers 属性HTML <th> 标签的 height 属性HTML <th> 标签的 nowrap 属性HTML <th> 标签的 rowspan 属性HTML <th> 标签的 scope 属性HTML <th> 标签的 valign 属性HTML <th> 标签的 width 属性HTML <thead> 标签的 align 属性HTML <thead> 标签的 char 属性HTML <thead> 标签的 charoff 属性HTML <thead> 标签的 valign 属性HTML <time> datetime 属性HTML <time> datetime 属性HTML <tr> 标签的 align 属性HTML <tr> 标签的 bgcolor 属性HTML <tr> 标签的 char 属性HTML <tr> 标签的 charoff 属性HTML <tr> 标签的 valign 属性HTML <track> default 属性HTML <track> kind 属性HTML <track> srclang 属性HTML <track> src 属性HTML <track> srclang 属性HTML <ul> 标签的 compact 属性HTML <ul> 标签的 type 属性HTML <video> autoplay 属性HTML <video> controls 属性HTML <video> height 属性HTML <video> loop 属性HTML <video> muted 属性HTML <video> poster 属性HTML <video> preload 属性HTML <video> src 属性HTML <video> width 属性HTML 5 Audio/Video DOM canplay 事件HTML 5 Audio/Video DOM canplaythrough 事件HTML 5 Audio/Video DOM durationchange 事件HTML 5 Audio/Video DOM loadeddata 事件HTML 5 Audio/Video DOM loadedmetadata 事件HTML 5 Audio/Video DOM loadstart 事件HTML 5 Audio/Video DOM progress 事件HTML 5 Audio/Video DOM addTextTrack() 方法HTML 5 Audio/Video DOM canPlayType() 方法HTML 5 Audio/Video DOM load() 方法HTML 5 Audio/Video DOM pause() 方法HTML 5 Audio/Video DOM play() 方法HTML 5 Audio/Video DOM audioTracks 属性HTML 5 Audio/Video DOM autoplay 属性HTML 5 Audio/Video DOM buffered 属性HTML 5 Audio/Video DOM controller 属性HTML 5 Audio/Video DOM controls 属性HTML 5 Audio/Video DOM currentSrc 属性HTML 5 Audio/Video DOM currentTime 属性HTML 5 Audio/Video DOM defaultMuted 属性HTML 5 Audio/Video DOM defaultPlaybackRate 属性HTML 5 Audio/Video DOM duration 属性HTML 5 Audio/Video DOM ended 属性HTML 5 Audio/Video DOM error 属性HTML 5 Audio/Video DOM loop 属性HTML 5 Audio/Video DOM mediaGroup 属性HTML 5 Audio/Video DOM muted 属性HTML 5 Audio/Video DOM networkState 属性HTML 5 Audio/Video DOM paused 属性HTML 5 Audio/Video DOM playbackRate 属性HTML 5 Audio/Video DOM played 属性HTML 5 Audio/Video DOM preload 属性HTML 5 Audio/Video DOM readyState 属性HTML 5 Audio/Video DOM seekable 属性HTML 5 Audio/Video DOM seeking 属性HTML 5 Audio/Video DOM src 属性HTML 5 Audio/Video DOM startDate 属性HTML 5 Audio/Video DOM textTracks 属性HTML 5 Audio/Video DOM videoTracks 属性HTML 5 Audio/Video DOM volume 属性HTML5 canvas addColorStop() 方法HTML5 canvas arc() 方法HTML5 canvas arcTo() 方法HTML5 canvas beginPath() 方法HTML5 canvas bezierCurveTo() 方法HTML5 canvas clearRect() 方法HTML5 canvas clip() 方法HTML5 canvas closePath() 方法HTML5 canvas createImageData() 方法HTML5 canvas createLinearGradient() 方法HTML5 canvas createPattern() 方法HTML5 canvas createRadialGradient() 方法HTML5 canvas drawImage() 方法HTML5 canvas fill() 方法HTML5 canvas fillRect() 方法HTML 5 canvas fillStyle 属性HTML5 canvas fillText() 方法HTML 5 canvas font 属性HTML5 canvas getImageData() 方法HTML 5 canvas globalAlpha 属性HTML 5 canvas globalCompositeOperation 属性HTML 5 canvas data 属性HTML 5 canvas height 属性HTML 5 canvas width 属性HTML5 canvas isPointInPath() 方法HTML 5 canvas lineCap 属性HTML 5 canvas lineJoin 属性HTML5 canvas lineTo() 方法HTML 5 canvas lineWidth 属性HTML5 canvas measureText() 方法HTML 5 canvas miterLimit 属性HTML5 canvas moveTo() 方法HTML5 canvas putImageData() 方法HTML5 canvas quadraticCurveTo() 方法HTML5 canvas rect() 方法HTML5 canvas rotate() 方法HTML5 canvas scale() 方法HTML5 canvas setTransform() 方法HTML 5 canvas shadowBlur 属性HTML 5 canvas shadowColor 属性HTML 5 canvas shadowOffsetX 属性HTML 5 canvas shadowOffsetY 属性HTML5 canvas stroke() 方法HTML5 canvas strokeRect() 方法HTML 5 canvas strokeStyle 属性HTML5 canvas strokeText() 方法HTML 5 canvas textAlign 属性HTML 5 canvas textBaseline 属性HTML5 canvas transform() 方法HTML5 canvas translate() 方法HTML onafterprint 事件属性HTML onbeforeprint 事件属性HTML onblur 事件属性HTML onchange 事件属性HTML onclick 事件属性HTML ondblclick 事件属性HTML onfocus 事件属性HTML onkeydown 事件属性HTML onkeypress 事件属性HTML onkeyup 事件属性HTML onload 事件属性HTML onmousedown 事件属性HTML onmousemove 事件属性HTML onmouseout 事件属性HTML onmouseover 事件属性HTML onmouseup 事件属性HTML onresize 事件属性HTML onselect 事件属性HTML onsubmit 事件属性HTML onunload 事件属性HTML 5 视频/音频参考手册HTML 参考手册HTML 5 Canvas 参考手册HTML <a> 标签HTML <abbr> 标签HTML <acronym> 标签HTML <address> 标签HTML <applet> 标签HTML <area> 标签HTML <article> 标签HTML <aside> 标签HTML <audio> 标签HTML <b> 标签HTML <base> 标签HTML <basefont> 标签HTML <bdi> 标签HTML <bdo> 标签HTML <big> 标签HTML <blockquote> 标签HTML <body> 标签HTML <br> 标签HTML <button> 标签HTML <canvas> 标签HTML <caption> 标签HTML <center> 标签HTML <cite> 标签HTML <code> 标签HTML <col> 标签HTML <colgroup> 标签HTML <command> 标签HTML <!--...--> 标签HTML <datalist> 标签HTML <dd> 标签HTML <del> 标签HTML <details> 标签HTML <dfn> 标签HTML <dialog> 标签HTML <dir> 标签HTML <div> 标签HTML <dl> 标签HTML <!DOCTYPE> 标签HTML <dt> 标签HTML <em> 标签HTML <embed> 标签HTML <fieldset> 标签HTML <figcaption> 标签HTML <figure> 标签HTML <font> 标签HTML <tt> <i> <b> <big> <small> 标签HTML <footer> 标签HTML <form> 标签HTML <frame> 标签HTML <frameset> 标签HTML <frameset> 标签的 cols 属性和 rows 属性HTML <head> 标签HTML <header> 标签HTML <h1> 到 <h6> 标签HTML <hr> 标签HTML <html> 标签HTML <i> 标签HTML <iframe> 标签HTML <img> 标签HTML <input> 标签HTML <ins> 标签HTML <kbd> 标签HTML <keygen> 标签HTML <label> 标签HTML <legend> 标签HTML <li> 标签HTML <link> 标签HTML <map> 标签HTML <mark> 标签HTML <menu> 标签HTML <menuitem> 标签HTML <meta> 标签HTML <meter> 标签HTML <nav> 标签HTML <noframes> 标签HTML <noscript> 标签HTML <object> 标签HTML <ol> 标签HTML <optgroup> 标签HTML <option> 标签HTML <output> 标签HTML <p> 标签HTML <param> 标签HTML <em> <strong> <dfn> <code> <samp> <kbd><var> <cite> 标签HTML <pre> 标签HTML <progress> 标签HTML xmlns 属性HTML <q> 标签HTML <rp> 标签HTML <rt> 标签HTML <ruby> 标签HTML <s> 标签HTML <samp> 标签HTML <script> 标签HTML <section> 标签HTML <select> 标签HTML <small> 标签HTML <source> 标签HTML <span> 标签HTML <strike> 标签HTML <strong> 标签HTML <style> 标签HTML <sub> 标签HTML <summary> 标签HTML <sup> 标签HTML <table> 标签HTML <tbody> 标签HTML <td> 标签HTML <textarea> 标签HTML <textarea> 标签的 wrap 属性HTML <tfoot> 标签HTML <th> 标签HTML <thead> 标签HTML <time> 标签HTML <title> 标签HTML <tr> 标签HTML <track> 标签HTML <tt> 标签HTML <u> 标签HTML <ul> 标签HTML <var> 标签HTML <video> 标签HTML <wbr> 标签W3C XHTML 活动CSS手册JavaScript手册

HTML <img> 标签的 usemap 属性

实例

客户器端图像映射:

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

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

亲自试一试

解释

上面这段源代码将一幅图像 planets.gif 映射为 3 个区域,当用户单击其中某一个区域时,将被链接到不同的文档中。

如需了解更多有关 map 和 area 元素的信息,请参阅:

定义和用法

usemap 属性将图像定义为客户端图像映射。

图像映射指的是带有可点击区域的图像。

usemap 属性与 <map> 元素的 name 或 id 属性相关联,以建立 <img> 与 <map> 之间的关系。

延伸阅读:详解 usemap 属性

HTML 4.01 与 HTML5 之间的差异

没有。

浏览器支持

所有浏览器都支持 usemap 属性。

语法

<img usemap="value">

属性值

描述
#mapname # + 要使用的 <map> 元素的 name 或 id 属性

参阅

延伸阅读:详解 usemap 属性

usemap 属性提供了一种“客户端”的图像映射机制,有效地消除了服务器端对鼠标坐标的处理,以及由此带来的网络延迟问题。通过特殊的 <map> 和 <area> 标签,HTML 创作者可以提供一个描述 usemap 图像中超链接敏感区域坐标的映射,这个映射同时包含相应的超链接 URL。usemap 属性的值是一个 URL,它指向特殊的 <map> 区域。用户计算机上的浏览器将把鼠标在图像上单击时的坐标转换成特定的行为,包括加载和显示另外一个文档。

我们举例说明一下,下面这段源代码将一个 100x100 像素的图像 map.gif 映射为 4 个区域,当用户单击其中某一个区域时,将被链接到不同的文档中。请注意,在这个 <img> 标签中,我们已经有效地包含了对 ismap 图像映射的处理功能,这样,那些使用不具有 usemap 处理功能的浏览器用户,就可以通过另外一中途径,即服务器端机制来处理图像映射:

<a href="/example/map">
  <img src="/i/map.gif" ismap="ismap" usemap="#map" />
</a>

<map name="map">
  <area coords="0,0,49,49" href="link1.html">
  <area coords="50,0,99,49" href="link2.html">
  <area coords="0,50,49,99" href="link3.html">
  <area coords="50,50,99,99" href="link4.html">
</map>

ismap 属性和 usemap 属性的应用差异

地图就是很好地应用 ismap 和 usemap 属性的一个示例,例如,在浏览一家全国范围的大公司网页时,用户可能会在地图上单击他们所居住的城市,以获得附近地区零售店的地址和电话号码等。

usemap 客户端处理图像映射的好处是,它不要求有服务器或特殊的服务器软件,与 ismap 机制不同,它可以用在非 web (无网络)环境中,例如在本地的文件或者 CD-ROM 中使用。

关于千图| 赞助千图 |千图首页   Copyright2014千图网   沪ICP备10011451号-6   用时:0.0266秒

千图网提示