画像Aに画像Bを上書きする方法についてです。
色んな方法がありますが、私が好きな方法を紹介します。
hoge.html
<div class="relative">
<img src="A.jpg">
<img src="B.jpg" id="uwagaki">
</div>
画像Aと画像Bをdivでくるみます。
hoge.css
#uwagaki {
position: absolute;
top:0;
left:0;
}
.relative {
position: relative;
}
次にcssでpositionをうまく使って、画像を重ねます。
画像Aと画像Bのサイズが同じ場合, これだけでピッタリと上書きさせることができます.
画像Bで**position:relative;**を使うと画像の分のスペースが空いてしまうので注意.
この方法はbootstrapで書いている場合でもちゃんと上書きしてくれます.