[分享]css两张图切换

CSS两张图切换，即使用CSS代码实现鼠标悬浮在图片上时，切换成另一张图片。下面是CSS代码实现的方法。

.img-container {
  display: flex;
  justify-content: center;
}

.img-container img {
  width: 300px;
  height: 200px;
  margin: 10px;
  transition: transform .5s ease;
}

.img-container img:hover {
  transform: scale(1.1);
} 

上述代码使用了flex布局，使图片水平居中显示。通过设置图片的宽度、高度、外边距和过渡效果，使图片鼠标悬浮时能够被放大。下面是HTML代码的实现。

<div class="img-container">
  <img src="img1.jpg">
  <img src="img2.jpg">
</div> 

HTML代码中，将两张图片放在一个div容器中，并分别使用不同的路径引用图片。这样就能实现鼠标悬浮时，轻松地切换显示不同的图片。