在 CSS 中，圖片的滑動(dòng)效果可以通過以下兩種方法來實(shí)現(xiàn)：使用 CSS 動(dòng)畫或者使用 JavaScript 腳本。

首先介紹一下使用 CSS 動(dòng)畫實(shí)現(xiàn)圖片滑動(dòng)的方法。我們可以通過 CSS3 中的animation屬性來設(shè)置動(dòng)畫。具體實(shí)現(xiàn)過程如下：

/* CSS 代碼 */
.slideshow {
width: 600px;
height: 300px;
overflow: hidden;
}
.slideshow img {
width: 600px;
height: 300px;
position: relative;
animation: slide 10s linear infinite;
}
@keyframes slide {
0% {
left: 0;
}
100% {
left: -600px;
}
}

以上代碼實(shí)現(xiàn)了一個(gè)圖片滑動(dòng)的動(dòng)畫，slideshow是包裹圖片的容器元素，設(shè)置了固定寬高及隱藏溢出部分。img元素則是要滑動(dòng)的圖片，通過設(shè)置position: relative;使其相對(duì)于容器進(jìn)行定位，再使用animation屬性來設(shè)置滑動(dòng)動(dòng)畫及持續(xù)時(shí)間、動(dòng)畫效果等。

另一個(gè)實(shí)現(xiàn)圖片滑動(dòng)的方法是使用 JavaScript 腳本。我們可以通過調(diào)整圖片的left或者right值來實(shí)現(xiàn)圖片滑動(dòng)的效果。具體實(shí)現(xiàn)過程如下：

// JavaScript 代碼
var slideIndex = 0;
showSlides();
function showSlides() {
var i;
var slides = document.getElementsByClassName("mySlides");
for (i = 0; i< slides.length; i++) {
slides[i].style.display = "none";
}
slideIndex++;
if (slideIndex > slides.length) {
slideIndex = 1;
}
slides[slideIndex-1].style.display = "block";
setTimeout(showSlides, 5000); // 5秒鐘切換一次圖片
}

以上代碼實(shí)現(xiàn)了一個(gè)自動(dòng)播放的圖片滑動(dòng)效果，mySlides是含有圖片的容器元素，通過 JavaScript 腳本動(dòng)態(tài)調(diào)整圖片的顯示與隱藏來實(shí)現(xiàn)滑動(dòng)效果。其中setTimeout方法用來設(shè)置圖片切換時(shí)間間隔，單位為毫秒。