CSS圖片不間斷滾動是讓圖片連續(xù)滾動的一種技術，這種技術可以用來制作圖片廣告或者網頁中的裝飾性效果。在這篇文章中，我們將介紹如何使用CSS來實現不間斷的圖片滾動。

首先，我們需要將我們想滾動的圖片放在一個容器內，并且讓容器有一個固定寬度和高度，以便我們可以將多張圖片放置在其中。

.container {
width: 500px;
height: 300px;
overflow: hidden; /* 隱藏溢出的圖片 */
}

接下來，我們需要使用CSS動畫來制作滾動效果。在此之前我們需要為每一張圖片設置寬度和高度，以免它們彼此之間產生變形。

img {
width: 500px;
height: 300px;
float: left; /* 讓圖片左浮動，以便它們可以橫向排列 */
}

現在我們需要加入CSS動畫，以確保圖片能夠不斷滾動。下面的代碼將會實現一個無限循環(huán)滾動的效果。

.animated {
animation: slide 10s infinite;
}
@keyframes slide {
0% {
transform: translateX(0%);
}
100% {
transform: translateX(-100%);
}
}

在上面的代碼中，我們將“slide”動畫應用于“animated”類別，以便滾動圖片。在這個動畫中，我們使用“translateX”變形將圖片沿著水平軸向左移動100%的寬度，然后再次回到起點。同時，我們設定了滾動的時間長度為10秒，并且將這個動畫無限循環(huán)。

最后，我們只需要將所有圖片的“animated”類添加到容器內即可！

通過上述的CSS代碼，我們可以輕松制作出一個漂亮的不間斷的圖片滾動效果，為你的網頁增加生動性和吸引力。