HTML div定位关闭

Question

我正在通过div在地图上定位点。

我有以下代码：

<div id="map" style = "background-image:url('map.gif');width:382px;height:524px;">

<DIV STYLE="position:absolute; top:222px; left:204px;">
<a href=""><img src="bullet.gif" border=0>Point</a>
</DIV>
</DIV>

当我在页面上添加此代码时，该点不在地图上，因此我添加了position：relative

<div id="map" style = "background-image:url('map.gif');width:382px;height:524px;position:relative;">

现在要点在地图上了，但与我最初想要的地方有些偏离。 反正有解决办法吗？ 这些点在不同的浏览器中也位于不同的位置。 有没有一种方法可以标准化位置？

Answer 1

我建议仅使用一个级别（而不是级联），也可以使用覆盖范围。

<div>
  <div>
  </div>
<div>

采用

<div style=...>     the map
</div>
<span style=...></span>   an overlayed rectangle
<span style=...></span>   an overlayed rectangle

这样可以吗 如果没有请指定，我会适应它。

Answer 2

那么您可能需要调整“ top”和“ left”值，因为“ point”现在绝对相对于“ map” div定位。 检查一下是否有帮助http://jsfiddle.net/DK9wT/6/