HTML5 图像映射答案

【问题标题】：HTML5 IMAGE MAPPINGHTML5 图像映射
【发布时间】：2021-06-18 16:35:19
【问题描述】：

<!DOCTYPE html>
<html>
    <head><title>Answer 6</title></head>
    <body>
        <img src="C:\Users\HP\OneDrive\Desktop\map_image.jpg" usemap="#new">
        <map name="new">
        </map>
        <area shape="rect"coords="68,51,275,182" href="https://en.wikipedia.org/wiki/North_America">
        <area shape="rect"coords="501,57,736,221" href="https://en.wikipedia.org/wiki/Asia">
        <area shape="rect"coords="206,239,321,405" href="https://en.wikipedia.org/wiki/South_America">
        <area shape="rect"coords="345,173,474,361" href="https://en.wikipedia.org/wiki/Africa">
        <area shape="rect"coords="142,449,726,495" href="https://en.wikipedia.org/wiki/Antarctica">
        <area shape="rect"coords="661,311,768,375" href="https://en.wikipedia.org/wiki/Australia">
        <area shape="rect"coords="379,63,492,142" href="https://en.wikipedia.org/wiki/Europe">
        </map>
    </body>
    </html>

我只是不明白错误在哪里！！！！！！！！！！！！我已经正确地完成了映射，但是当我单击图像时它仍然没有映射到链接！谁能解释一下？？

【问题讨论】：

考虑删除第一个<area之前的``？
这里不能使用“C:\Users\HP\OneDrive\Desktop\”等本地路径。
kindpng.com/picc/m/… 这是这张图片的链接
@evolutionxbox 非常感谢，今天我知道模因在程序员的生活中确实很重要。我犯了多么愚蠢的错误

标签： javascript html css web mapping

【解决方案1】：

您必须删除</map> 的额外结束标签，它才会起作用

更新工作示例：

<body>
    <img style="border: 5px solid black" src="https://i.ibb.co/kJW37VH/Screen-Shot-2021-06-18-at-7-00-41-PM.png" usemap="#new">
    <map name="new">
        <area shape="rect"coords="0,0,320,320" href="https://google.com">
        <area shape="rect"coords="320,0,640,320" href="https://fb.com">
    </map>
</body>

您必须删除</map> 的额外结束标记，它才会起作用

【讨论】：

考虑在答案中添加一个 sn-p 或示例？