html - 将按钮放置在将成为 map 的 png 上的最佳方法

Question

标题基本上解释了所有,,我有一个 map img(png 或 jpg)，我想在 map 上放置标记，如果分辨率发生变化(媒体查询)，这些标记将缩放。所以 map 上的点是按钮..我该怎么做？目前我有一个容器，里面有一个背景图像，就是 map ......

#container-map{
    background-image: url(../img/map.png);
    z-index:9999;
    width:350px;
    height:900px;
    margin-left:150px;
    background-position: 0% 70%;
    background-repeat: no-repeat;
}

那么我要如何在作为 map 的图像上放置小标记，以便我可以在所选按钮上提取信息？

Answer 1

您可以设置按钮 position: absolute 并使其 z-index 比图像上的更多。

另一种方法是设置 block 的 background-image，然后在其上放置标记。