CSS3是目前前端開發領域中重要的技術之一，它提供了許多新的樣式和動畫效果。其中，搖一搖動畫是一種很有趣和實用的效果。

/* 實現搖一搖動畫的CSS代碼 */
.shake {
animation: shake 0.5s;
animation-iteration-count: infinite;
}
@keyframes shake {
0% {transform: translate(0, 0) rotate(0);}
10% {transform: translate(-10px, 0) rotate(-5deg);}
20% {transform: translate(-20px, 0) rotate(5deg);}
30% {transform: translate(-30px, 0) rotate(-5deg);}
40% {transform: translate(-40px, 0) rotate(0);}
50% {transform: translate(-30px, 0) rotate(5deg);}
60% {transform: translate(-20px, 0) rotate(-5deg);}
70% {transform: translate(-10px, 0) rotate(5deg);}
80% {transform: translate(0, 0) rotate(-5deg);}
90% {transform: translate(10px, 0) rotate(5deg);}
100% {transform: translate(0, 0) rotate(0);}
}

上面的代碼實現了一個元素的搖一搖動畫效果，可以應用于各種網頁，如游戲、電商等。

其中，通過keyframes定義了搖一搖的動畫過程。animation屬性指定了動畫的名稱以及持續時間，animation-iteration-count指定了動畫的循環次數，此處設置為無限循環。在實際使用中，可以通過JavaScript控制元素的className來實現動畫的啟動和停止。

CSS3搖一搖動畫可以為網頁帶來一些有趣和活潑的效果，讓網頁看起來更加生動。然而，過度使用動畫效果可能會導致網頁加載時間過長、用戶體驗不佳等問題，因此在實際使用中需要慎重考慮。