今天我們來學習一下如何使用CSS讓圖片無限循環(huán)顯示。在CSS中，我們可以使用動畫屬性來實現圖片的循環(huán)顯示。 首先我們先準備一張要循環(huán)顯示的圖片。在本例中，我將使用一張名為“background.jpg”的圖片。接著我們使用CSS來設置這張圖片的樣式。

我們先將圖片設置為背景圖片，可以使用如下代碼：

background-image: url('background.jpg');

接著我們來設置動畫屬性，代碼如下：

animation: slidein 5s infinite;

在這段代碼中，“slidein”是我們給動畫起的名字，“5s”表示動畫持續(xù)5秒，“infinite”表示動畫無限次循環(huán)。

接下來我們要為動畫設置關鍵幀，代碼如下：

@keyframes slidein {
from {
transform: translateX(0%);
}
to {
transform: translateX(-100%);
}
}

在這段代碼中，我們使用了“transform: translateX()”來實現圖片的移動。在“from”狀態(tài)中，圖片的位置是在原始位置，而在“to”狀態(tài)中，圖片的位置會向左移動100%的距離。這樣就實現了圖片的循環(huán)顯示。

最后，我們將所有的代碼整合在一起，如下所示：

#background {
background-image: url('background.jpg');
animation: slidein 5s infinite;
}
@keyframes slidein {
from {
transform: translateX(0%);
}
to {
transform: translateX(-100%);
}
}

至此，我們就學會了如何使用CSS讓圖片無限循環(huán)顯示，希望大家可以掌握這個技巧，為自己的網站添加一些好看的動畫效果。