在CSS中，我們可以使用animation和@keyframes來實現(xiàn)兩張圖片的滾動變換，以下是一個簡單的示例：

我們需要準備兩張圖片，分別命名為image1.png和image2.png。

我們可以創(chuàng)建一個HTML元素來承載這兩張圖片：

<div class="image-container">
  <img class="image1" src="image1.png" />
  <img class="image2" src="image2.png" />
</div>

我們可以使用CSS來定義動畫：

@keyframes roll {
  0% { transform: translateX(0); }
  50% { transform: translateX(100%); }
  100% { transform: translateX(0); }
}
.image-container {
  width: 200px;
  height: 200px;
  position: relative;
  overflow: hidden;
}
.image1, .image2 {
  position: absolute;
  width: 100%;
  height: 100%;
  animation: roll 2s infinite;
}
.image2 {
  animation-delay: 1s;
}

在這個示例中，我們創(chuàng)建了一個名為roll的動畫，該動畫會將圖片從左側(cè)滾動到右側(cè)，然后再從右側(cè)滾動到左側(cè)，我們還將圖片設(shè)置為***定位，以便它們可以疊加在一起，我們給第二張圖片添加了一個延遲，以便它可以無縫地跟隨***張圖片進行滾動。