0

私はこのグリッド、58x58のブロックを持っています。このグリッドの背景画像があり、特定のブロックにいくつかの画像を配置したいと思います。だから私は以下のコードを使用しました:

<div style="position: relative !important; right: 0px" id="div">
   <img src="/6f89ab34.jpg">
</div>

各要素は以前の要素に関連しているため、ウィッチはただの苦痛です。

この問題に取り組むためのより賢い方法はありますか?

たとえば、画像1を行1、ブロック2に配置し、画像2を行3、ブロック4に配置すると言うことができますか?

4

1 に答える 1

3

それを処理する方法はたくさんあります。クラスの使用をお勧めします。1つのセットは絶対的にx軸上に配置され、もう1つのセットはy軸上に配置されます。

.tile {position: absolute;}

.x1 {left: 0px;}
.x2 {left: 58px;}
.x3 {left: 116px;}

.y1 {top: 0px;}
.y2 {top: 58px;}
.y3 {top: 116px;}

次に、各アイテムをクラスで配置できます。

<div class="tile x1 y3">
于 2012-10-10T18:38:59.460 に答える