CSS中的動畫效果已經被廣泛應用在網頁設計中，其中圖片播放速度的控制也是比較重要的一點。通過CSS提供的animation屬性可以很方便地實現圖片的播放效果。下面是一個示例：

/* 定義圖片的播放動畫 */
@keyframes playImg {
0% {background-image: url('img1.jpg');}
25% {background-image: url('img2.jpg');}
50% {background-image: url('img3.jpg');}
75% {background-image: url('img4.jpg');}
100% {background-image: url('img5.jpg');}
}
/* 應用動畫效果 */
img {
width: 500px;
height: 300px;
background-repeat: no-repeat;
animation: playImg 10s infinite;
/* 10s表示動畫持續時間，infinite表示無限循環 */
}

在上面的示例中，我們定義了一個名為playImg的動畫，其中通過關鍵幀來定義了每個時刻圖片應該顯示的內容。然后將這個動畫應用到了img元素上，使得圖片會在10秒內播放完這五張圖片，并且循環播放。

需要注意的是，圖片的播放速度會受到animation-duration屬性的影響，也就是動畫的持續時間。在上面的示例中，我們將animation-duration設為10秒，因此每張圖片的顯示時間就是2秒。如果需要加快或者減慢播放速度，可以調整這個屬性的值。

除了animation-duration，還可以通過animation-timing-function來調整動畫的速度變化情況。默認情況下，CSS會使用ease函數來模擬動畫的速度曲線，也就是開始和結束時比較慢，中間的過程比較快。如果需要調整這個曲線，可以使用其他的速度函數，例如linear、ease-in、ease-out等。

總之，通過CSS的動畫效果，我們可以輕松實現圖片的播放效果，并且通過調整各種參數可以控制播放速度和速度變化情況，使得網頁效果更加生動。