html 图像悬停在另一个图像上

Posted 2021-05-11

<style>
.imageBox {
  position: relative;
  float: left;
}

.imageBox .hoverImg {
  position: absolute;
  left: 0;
  top: 0;
  display: none;
}

.imageBox:hover .hoverImg {
    display: block;
}  
  
</style>


<div class="imageBox">
    <div class="imageInn">
        <img src="image1.jpg">
    </div>
    
    <div class="hoverImg">
        <img src="image2.jpg">
    </div>
</div>