HTML <map> tag
Definition and Usage
Defines a client-side image-map. An image-map is an image with clickable regions.
Differences Between HTML and XHTML
NONE
Tips and Notes
Note: The area element is always nested inside the map element.
The area element defines the regions in the image map.
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>.
Example
| Source |
Output |
<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:
|
Required Attributes
DTD indicates in which DTD the attribute is
allowed. S=Strict, T=Transitional, and F=Frameset.
| Attribute |
Value |
Description |
DTD |
| id |
unique_name |
Defines a unique name for the map tag |
STF |
Optional Attributes
| Attribute |
Value |
Description |
DTD |
| name |
unique_name |
Defines a unique name for the map tag (for backwards compability) |
STF |
Standard Attributes
| class, title, style, dir, lang, xml:lang |
For a full description, go to Standard Attributes.
Event Attributes
| tabindex, accesskey, onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup, onfocus, onblur |
For a full description, go to Event Attributes.
Try-It-Yourself Demos
Create an image map
How to create an image map, with clickable regions. Each of the regions is a hyperlink.
Whether you're new to XML or already an advanced user, the user-friendly views
and powerful entry helpers, wizards, and debuggers in XMLSpy are designed to
meet your XML and Web services development needs from start to finish.
- XML editor
- Graphical XML Schema / DTD editors
- XSLT 1.0/2.0 editor, debugger, profiler
- XQuery editor, debugger, profiler
- Support for Office Open XML (OOXML)
- Graphical WSDL editor & SOAP debugger
- Java, C#, C++ code generation
- And much more!
Download a free 30-day trial today!
Click to see a demo!
Learn what’s new in v2008
|
HOME
Printer friendly page
