网络学院 w3pop社区 网络资源 IT新闻

w3pop.com :: 网络学院 :: HTML :: HTML <map> 标签

会员登陆

帐号

密码

回答

记住密码

忘记密码? 注册

HTML <map> 标签

作者:w3pop.com 翻译/整理:w3pop.com 发布:2007-04-28 修改:2007-05-07 浏览:2267 :: ::

定义与用法

Defines a client-side image-map. An image-map is an image with clickable regions.
定义用户端的图象热点。热点就是图片上可点击的区域

在HTML和XHTML中的区别

NONE
无

提示与注意点

Note: The area element is always nested inside the map element. The area element defines the regions in the image map.
注意：area元素要在map元素内使用。area元素可定义图象热点的区域

Note: The usemap attribute in <img> refers to the id or name (browser dependant) attribute in <map>, therefore we have added both the id and name attributes to <map>.
注意：在<img>中的usemap属性会指向在<map>里的id或name属性，因此要在<map>中得将id和name属性都加上。

实例

代码 输出
<p>Click on one of the planets:</p>

<img src ="planets.gif"
width ="145" height ="126"
alt="Planets"
usemap ="#planetmap" />

<map id ="planetmap"
name="planetmap">
<area shape ="rect" coords ="0,0,82,126"
  href ="sun.htm" target ="_blank"
  alt="Sun" />
<area shape ="circle" coords ="90,58,3"
  href ="mercur.htm" target ="_blank"
  alt="Mercury" />
<area shape ="circle" coords ="124,58,8"
  href ="venus.htm" target ="_blank"
  alt="Venus" />
</map>

Click on one of the planets:
请点击下面的这张行星图：

Planets Sun Mercury Venus

 

必要属性

DTD indicates in which DTD the attribute is allowed. S=Strict, T=Transitional, and F=Frameset.
下表中的DTD列指明了被支持的DTD属性。S=Strict（精确的），T=Transitional（传统的），F=Frameset（框架）

属性 值 描述 DTD
id unique_name Defines a unique name for the map tag
定义map标签的唯一name		 STF

可选属性

属性 值 描述 DTD
name unique_name Defines a unique name for the map tag (for backwards compability)
定义map标签的唯一name		 STF

标准属性

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

For a full description, go to Standard Attributes.
查看完整的属性

事件属性

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

For a full description, go to Event Attributes.
查看完整的属性

尝试与演示

Create an image map
How to create an image map, with clickable regions. Each of the regions is a hyperlink.
如何建立带有可点区域的图象热点，并且每个区域都为超级连接

评论 (0) All