CSS3圖片向左滑動效果是一種非常炫酷的網頁設計方法，可以吸引許多用戶的注意力。下面我們就來學習一下如何實現這種效果。

/*樣式表*/
.box{
width: 500px;
height: 300px;
overflow: hidden;
}
.imgBox{
height: 100%;
width: 2000px;
background-image: url("image.jpg");
animation: slide 10s linear infinite;
}
@keyframes slide{
0%{
transform: translateX(0);
}
100%{
transform: translateX(-1500px);
}
}

首先，我們需要一個容器來包裹圖片，然后利用CSS3的動畫屬性來實現向左滑動的效果。在這個例子中，我們使用了一個div元素，并給它設置了一個寬度和高度，同時讓它的overflow屬性為hidden，這是為了讓圖片超出容器的部分不可見。

接下來，我們創建了一個類名為imgBox的CSS樣式，在這個樣式中，我們將背景圖片的寬度增大到2000px，這是為了讓圖片能夠在容器內持續地重復滑動，然后我們為這個類名添加了一個動畫，名為slide，這個動畫會在10秒的時間內以線性的方式持續不斷地執行。

最后，我們在動畫中定義了兩個關鍵幀，0%和100%，分別代表動畫的開始和結束狀態。在0%這個關鍵幀中，我們將圖片的位置設置為當前位置，即translateX(0)，在100%這個關鍵幀中，我們將圖片的位置設置為向左移動1500px，即translateX(-1500px)，這樣就實現了向左滑動的效果。

通過以上的CSS樣式的設置，我們就能實現一個很棒的CSS3圖片向左滑動效果，可以大大提高我們的網頁設計水平。