in the vue project, there are the following html:
<div class="ware-image" :style=""background-image: url(" + ware.mainPic + ")""></div>
<i class="sticker-image" :style=""background-image: url(" + ware.sticker + ")""></i>
css is:
.ware-image
display: inline-block
width: 60px
height 60px
font-size: $font-size-medium
background-size: contain
background-repeat: no-repeat
vertical-align: middle
border: 1px solid $color-primary
.sticker-image
position: absolute
display: inline-block
width: 20px
height: 20px
background-size: contain
margin-left: (-@width)px
but the final effect is:
the overlapping part of the picture shows the color of the first picture. It is useless for me to set z-index. How to solve it?