CSS3是一種用于網頁設計的樣式表語言，它可以為網站添加豐富的動效和美觀的界面。其中一個常見的應用場景就是制作輪播圖，通過CSS3的動畫效果可以讓頁面更具有吸引力。

下面我們來看一個用CSS3制作的小輪播圖：

【CSS代碼】
.slide {
position: relative;
width: 500px;
height: 300px;
overflow: hidden;
}
.slide ul {
position: absolute;
top: 0;
left: 0;
width: 1500px;
height: 300px;
list-style: none;
margin: 0;
padding: 0;
animation: move 10s infinite;
}
.slide li {
float: left;
width: 500px;
height: 300px;
background-color: #ccc;
text-align: center;
line-height: 300px;
font-size: 24px;
}
@keyframes move {
0% {
left: 0;
}
25% {
left: -500px;
}
50% {
left: -1000px;
}
75% {
left: -1500px;
}
100% {
left: 0;
}
}

首先，我們創建了一個class為slide的div，它作為輪播圖的容器。

然后，在slide中創建一個ul元素，它的寬度是li元素的三倍，這是因為我們要讓輪播圖有三張圖片在播放。ul的樣式設置為absolute，使它脫離文檔流，left和top屬性都為0，使它相對于slide頂部左邊對齊。同時，ul元素的動畫屬性animation被設置為moverepeat，讓它在10s內不斷重復播放move動畫。

接下來，每個li元素都代表了輪播中要顯示的一張圖片，它們的樣式都設置為float: left，讓它們從左到右排列。

最后，move動畫被定義了五個階段：0%的時候，ul的left為0，第一張圖片完全出現；25%的時候，ul的left為-500px，第二張圖片完全出現；50%的時候，ul的left為-1000px，第三張圖片完全出現；75%的時候，ul的left為-1500px，輪播圖回到了初始位置；100%的時候，ul的left又變成了0px，整個循環重復。

這樣，我們就成功地用CSS3制作了一個小輪播圖。