CSS3滑動動畫特效是網頁設計中常見的一種特效，它可以讓頁面看起來更加生動，有趣，而且也有很多不同的實現方式。今天，我們就來介紹一種基于CSS3的滑動動畫特效代碼。

/* 設置容器寬高 */
.container {
width: 800px;
height: 400px;
position: relative;
overflow: hidden;
}
/* 設置動畫元素位置和寬高 */
.box {
width: 400px;
height: 400px;
position: absolute;
top: 0;
left: 0;
}
/* 設置動畫元素的動畫屬性 */
.box:hover {
animation: slide 2s ease-in-out infinite;
}
/* 定義動畫 */
@keyframes slide {
0% {
transform: translateX(0);
}
50% {
transform: translateX(400px);
}
100% {
transform: translateX(0);
}
}

首先，我們需要先設置一個容器來包裹我們的動畫元素，容器的寬高可以根據實際需求進行設置，設置好之后，我們需要給動畫元素設置寬高和位置屬性。接下來，我們要定義動畫元素的動畫屬性，這里我們使用:hover屬性來表示元素被鼠標懸浮時觸發動畫。

最后，我們需要定義具體的動畫效果，這個動畫效果可以根據實際需求進行調整。在這個示例中，我們使用了CSS3的transform屬性，通過translateX()函數來實現元素的水平滑動。在動畫定義的時候，需要設置不同時間點下元素的不同狀態，比如在0%時元素的位置為初始位置，50%時元素的位置位于容器的右側，100%時元素的位置又回到了初始位置，通過這些狀態的不斷切換，實現了平滑的滑動效果。

總的來說，CSS3的滑動動畫特效是一種實現簡單、效果好的特效，在實際的網頁設計中也經常會用到。學會這種特效的代碼實現，對于提升自己的網頁設計能力也是有很大的益處的。