Enter HTML5 entry to proficient:<map> label

Source: Internet
Author: User
Keywords tags HTML5 Getting started to master

"Reprint please retain the integrity of the content of the Wind network article, if you do not comply with this principle, we will retain the right to pursue legal responsibility"

<map> Label

Definitions and usage

The <map> label defines the image map of the client. An image map is an image with a clickable region.

Differences between HTML 4.01 and HTML 5

The Http://www.aliyun.com/zixun/aggregation/11696.html >name property is no longer supported in HTML 5.

Tips and Comments:

Wind Network (www.ithov.com) Note: The area element is always nested inside the map element. An AREA element defines a region in an image map.

Property

The

Property Value Description 4 5 ID unique_name defines a unique name for the map label. 4 5 name Unique_name defines a unique name for the map label. Not supported. 4

Standard properties

Class, Contenteditable, ContextMenu, dir, draggable, id, irrelevant, lang, ref, Registrationmark, TabIndex, template, For a complete description of the title, visit the standard properties in HTML 5.

Event Properties

Onabort, onbeforeunload, onblur, onchange, onclick, OnContextMenu, ondblclick, Ondrag, Ondragend, OnDragEnter, OnDragLeave, OnDragOver, ondragstart, OnDrop, OnError, onfocus, onkeydown, onkeypress, onkeyup, onload, OnMessage, OnMouseDown, OnMouseMove, onmouseover, onmouseout, onmouseup, OnMouseWheel, OnResize, Onscroll, Onselect, onsubmit, OnUnload for a complete description, visit the event properties in HTML 5.

Tiy instance

Create an image map

This example shows how to create an image map with clickable regions. Each of these areas is a hyperlink.

<html>
<body>
<p> Wind Network (www.ithov.com) Tip: Click on the Stars on the image to enlarge them. </p>
<img
src= "/i/eg_planets.jpg"
border= "0" usemap= "#planetmap"
alt= "Planets"/>
<map name= "Planetmap" id= "Planetmap"
<area
Shape= "Circle"
coords= "180,139,14"
href = " Example/html/venus.html '
target = ' _blank '
alt= ' Venus '/>
<area
shape= ' Circle '
coords= ' 129,161,10 "
href ="/example/html/mercur.html "
target =" _blank "
alt=" Mercury "/>
<area
Shape= "Rect"
coords= "0,0,110,260"
href = "/example/html/sun.html"
target = "_blank"
alt= "Sun"/>
</ Map>
<p><b> Note: the "Usemap" attribute in the </b>img element refers to the ID or name attribute in the Map element (according to the browser), so we also added "id" and " Name property. </p>
</body>
</html>

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.