h5+css图片轮播,轮播时看到下一张图片

您可以使用CSS的`opacity`属性来实现图片轮播时看到下一张图片的效果。具体实现方法如下：

1. 将所有图片的`position`属性设置为`absolute`，并且宽度和高度都设置为相同的值，以便排列在同一个位置。

2. 将每张图片的`opacity`属性设置为`0`，以便隐藏图片。

3. 将第一张图片的`opacity`属性设置为`1`，以便显示第一张图片。

4. 使用CSS动画或JavaScript定时器来控制图片轮播的效果。

5. 在动画或定时器中，将当前显示的图片的`opacity`属性设置为`0`，同时将下一张图片的`opacity`属性设置为`1`，以便显示下一张图片。

6. 如果需要实现循环轮播的效果，可以在最后一张图片的动画或定时器中将当前显示的图片设置为第一张图片，以便循环播放。

下面是一个使用CSS动画实现图片轮播的示例代码：

HTML代码：

<div class="slider">
  <img src="img1.jpg">
  <img src="img2.jpg">
  <<img src="img3.jpg">
</div>

CSS代码：

.slider {
  position: relative;
  width: 500px;
  height: 300px;
  overflow: hidden;
}
.slider img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.slider img:first-child {
  opacity: 1;
  animation: slide 4s infinite;
}
@keyframes slide {
  0% {
    opacity: 1;
  }
  25% {
    opacity: 0;
  }
  75% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

在上面的代码中，我们使用了CSS的`animation`属性来实现图片轮播。具体来说，我们定义了一个名为`slide`的动画，持续时间为4秒，无限循环。在动画中，我们将第一张图片的`opacity`属性从`1`逐渐变为`0`，然后将第二张图片的`opacity`属性从`0`逐渐变为`1`，以便实现图片轮播的效果。