0

私は自分の問題に対する答えを探し回っていますが、ほとんどの場合、似ているように見えるが異なる問題に対する答えを見つけました。

他のいくつかの小さな画像を配置しようとしている画像があります。小さな画像で「位置：継承」を使用できるように、大きな画像を配置しました。これはうまく機能します。私の画像は背景に完全に配置されています。

私の問題は、これを機能させるには、より大きな画像を「position:absolute」としてスタイル設定する必要があることです。したがって、仕掛け全体をページのどこにも移動できませんが、現在存在する左上側に移動できません。

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

#Mapdiv を親 div でラップし、親 div に次のように指定します。

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

デモを参照してください。

于 2013-02-14T06:40:43.540 に答える
0

次に、画像を配置する必要があるため、 と を使用する必要が#Mapあります。これは、画像の配置に役立ちますabsolutelefttop

于 2013-02-14T06:59:50.470 に答える