我們可以將圖像放在HTML中的圖像上嗎？

Question

我們可以在HTML中的圖像上放置圖像嗎？

我想要一些圖像說a.jpg來放置圖像b.jpg。請告訴它是否可能在（僅）HTML中不在
CSS？

而且如果是那麼如何？

Answer 1

Reference

<img style="background:url(imageURL)" src="imageURL"/> 

例JSBin

Answer 2

可以使用位置上重疊的兩個圖像？

<div> 
    <img src="" class="a"> 
    <img src="" class="b"> 
<div> 

div { 
position:relative; 
} 

.a { 
    position:absolute; 
    z-index:1; 
    top:0; left:0; 
} 

.b { 
    position:absolute; 
    z-index:2; 
    top:0; left:0; 
} 

B圖像將重疊圖像。

Answer 3

把東西準確地放在另一個上面的最好方法是將它們全部包裝在 （div style =「position：relative」）中，然後使用「position：absolute」和它們的頂部和左側位置相對到周圍的div。 由於調整瀏覽器窗口的大小，當相對div移動到頁面上的不同位置時，其中的所有內容（包括位置：absolute）都會隨之移動。

像這樣的東西可以做到這一點：

<div style="position:relative; left:0; top:0;"> 
    <img src="x.png" style="position:relative; top:0; left:0;"/> 
    <img src="y.png" style="position:absolute; top:30; left:70;"/> 
</div>