0

我一直在寻找我的问题的答案，但我大多找到了一个看起来相似但仍然不同的问题的答案。

我有一个图像，我试图在其上放置几个其他较小的图像。我将较大的图像放在 a 中，这样我就可以在较小的图像上使用“位置：继承”，这很好用：我的图像完美地放置在它们的背景上。

我的问题是，为了工作，这需要将我的较大图像设置为“位置：绝对”。因此，我无法将我的整个装置移动到页面上的任何位置，但它当前所在的左上角。

HTML 文件：

<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="Map">

<img id="X0001Y0001" src="blue_brick.png">

</div>
</body>
</html>


CSS文件：

#Map {
background-image:url('CoreMini.png');
height:128px;
width:256px;
position:absolute;
}

#X0001Y0001{position:inherit;top:0px; left:9px}
4

2 回答 2

1

将您的 div 包装#Map在父 div 中，并为父 div 提供以下内容：

#parent {
  position: relative;
  margin: 0 auto;
  width: 256px;
}

见演示。

于 2013-02-14T06:40:43.540 回答
0

由于您#Map是absolute为了定位您需要使用的图像left和top. 这将帮助您定位图像

于 2013-02-14T06:59:50.470 回答