html - How to create correct HTML5 documents that use maps? -
i'm considering example html5 specification: https://www.w3.org/tr/html5/embedded-content-0.html#image-maps
<p> please select shape: <img src="shapes.png" usemap="#shapes" alt="four shapes available: red hollow box, green circle, blue triangle, , yellow four-pointed star."> <map name="shapes"> <area shape=rect coords="50,50,100,100"> <!-- hole in red box --> <area shape=rect coords="25,25,125,125" href="red.html" alt="red box."> <area shape=circle coords="200,75,50" href="green.html" alt="green circle."> <area shape=poly coords="325,25,262,125,388,125" href="blue.html" alt="blue triangle."> <area shape=poly coords="450,25,435,60,400,75,435,90,450,125,465,90,500,75,465,60" href="yellow.html" alt="yellow star."> </map> </p> my concern map transparent element.
transparent means removing corresponding opening , closing tags, document must still correct.
that is, following fragment has correct.
<p> please select shape: <img src="shapes.png" usemap="#shapes" alt="four shapes available: red hollow box, green circle, blue triangle, , yellow four-pointed star."> <area shape=rect coords="50,50,100,100"> <!-- hole in red box --> <area shape=rect coords="25,25,125,125" href="red.html" alt="red box."> <area shape=circle coords="200,75,50" href="green.html" alt="green circle."> <area shape=poly coords="325,25,262,125,388,125" href="blue.html" alt="blue triangle."> <area shape=poly coords="450,25,435,60,400,75,435,90,450,125,465,90,500,75,465,60" href="yellow.html" alt="yellow star."> </p> however, context in area element can used map or template descendant. means <p> ... </p> has surrounded template element.
however template element description is:
the template element used declare fragments of html can cloned , inserted in document script.
which seems unrelated image maps ...
how create correct html5 documents use maps?
edit: answer got deleted leveraged interesting point : according w3c validator, the above document correct when surrounded usual html boilerplate.
Comments
Post a Comment