CSS代碼可以用來實現圖片的滑動效果。下面我們就一起來看看如何實現。

//HTML代碼
<div class="slider">
<img src="image1.jpg">
<img src="image2.jpg">
<img src="image3.jpg">
<img src="image4.jpg">
</div>
//CSS代碼
.slider {
width: 600px;  /*輪播圖寬度*/
margin: 0 auto;  /*居中*/
overflow: hidden;  /*超出部分隱藏*/
position: relative;
}
.slider img {
width: 100%;  /*圖片寬度*/
display: none;  /*默認隱藏*/
position: absolute; /*絕對定位*/
top: 0;
left: 0;
}
.slider img:first-child {
display: block; /*第一張圖片顯示*/
}

上述代碼中，首先我們需要一個包含所有圖片的div容器，給其添加了一些樣式使其水平居中，并且超出部分隱藏。

接著，我們給所有圖片添加了同樣的樣式，使其寬度為100%, 隱藏，并且設置為絕對定位，這樣才能夠產生輪播的效果。

最后，我們將第一張圖片設置為顯示狀態，讓其顯示在輪播圖的第一張位置，這樣我們的圖片滑動效果就可以出現了。