呆38 2023-05-30 14:44 采纳率: 0%
浏览 67

HTML 怎么在HTML中将中国的各个省拼成一个完整的中国地图 然后点击每个省就会跳转新的页面怎么弄啊

HTML 怎么在HTML中将中国的各个省拼成一个完整的中国地图 然后点击每个省就会跳转新的页面怎么弄啊

  • 写回答

3条回答 默认 最新

  • 0x0007 2023-05-30 15:07
    关注

    Demo ：

    <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>中国地图</title>
    <style>
        #map {
            position: relative;
            display: inline-block;
            background-image: url('china-map.png'); /* 地图图片 */
            background-size: cover;
            width: 800px;
            height: 600px;
        }

        .area {
            position: absolute;
            cursor: pointer;
            background-color: rgba(0,0,0,0);
        }

        /* 省份热区的坐标及大小 */
        #area-beijing {
            left: 300px;
            top: 120px;
            width: 40px;
            height: 40px;
        }

        #area-shanghai {
            left: 420px;
            top: 290px;
            width: 40px;
            height: 40px;
        }

        /* 更多省份热区... */
    </style>
</head>
<body>
    <div id="map">
        <a href="beijing.html"><div id="area-beijing" class="area"></div></a>
        <a href="shanghai.html"><div id="area-shanghai" class="area"></div></a>
        <!-- 更多省份热区... -->
    </div>
</body>
</html>
    评论

报告相同问题？

问题事件

  • 创建了问题 5月30日

悬赏问题

  • ¥15 有两个非常“自以为是”烦人的问题急期待大家解决！
  • ¥30 STM32 INMP441无法读取数据
  • ¥100 求汇川机器人IRCB300控制器和示教器同版本升级固件文件升级包
  • ¥15 用visualstudio2022创建vue项目后无法启动
  • ¥15 x趋于0时tanx-sinx极限可以拆开算吗
  • ¥500 把面具戴到人脸上，请大家贡献智慧，别用大模型回答，大模型的答案没啥用
  • ¥15 任意一个散点图自己下载其js脚本文件并做成独立的案例页面，不要作在线的，要离线状态。
  • ¥15 各位 帮我看看如何写代码，打出来的图形要和如下图呈现的一样，急
  • ¥30 c#打开word开启修订并实时显示批注
  • ¥15 如何解决ldsc的这条报错/index error