如何放置在其它圖像

我試圖將典當的圖像的一部分圖像上的棋子的其他圖像的一部分，但是當我試圖做到這一點，它把以前的棋子附近的走卒：
enter image description here 如何放置在其它圖像

這就是我想要到有：
enter image description here

HTML：

<td class="" row="0" col="0"><span>1</span> 
<img class="soldiers" playernumber="1" soldiernumber="1" src="Resources/images/player_1.png"> 
<img class="soldiers" playernumber="1" soldiernumber="2" src="Resources/images/player_1.png"> 
<img class="soldiers" playernumber="1" soldiernumber="3" src="Resources/images/player_1.png"> 
<img class="soldiers" playernumber="1" soldiernumber="4" src="Resources/images/player_1.png"> 
<img class="soldiers" playernumber="2" soldiernumber="1" src="Resources/images/player_2.png"> 
<img class="soldiers" playernumber="2" soldiernumber="2" src="Resources/images/player_2.png"> 
<img class="soldiers" playernumber="2" soldiernumber="3" src="Resources/images/player_2.png"> 
<img class="soldiers" playernumber="2" soldiernumber="4" src="Resources/images/player_2.png"> 
</td>

CSS：

td { 
    width: 80px; 
    height: 80px; 
    text-align: left; 
    vertical-align: top; 
    border: 1px solid black; 
    position: relative; 
} 

.soldiers 
{ 
    width:20px; 
    height:20px; 
} 

td span { 
    position: absolute; 
    bottom: 0; 
}

來源

2014-09-27 E235

以後移動的作品，你要使用與.soldiers類的絕對定位 – 2014-09-27 15:18:28

我已經準備了證明你打算什麼。

$(function(){ 
    var s = 0; 
    $('.soldiers').each(function(){ 
     $(this).css({'top':s,'left':s}); 
     s+=10; 
    }); 
});

發生了什麼的小提琴被我已經添加position:absolute;到類.soldiers 和遞增（通過jQuery每個（）方法）確定的值（在本例10），用於top和left，給每個.soldiers元素。

您可能還需要與z-index合作工作層定位爲戰士，如果你對

來源

2014-09-27 15:21:33 henser

如何放置在其它圖像

回答

相關問題