CSS左右擺的動畫是一種流行的動態效果，可以為您的網頁增添生動活潑的氣息。這種動畫的核心是借助CSS3的屬性“transform”和“transition”，實現對目標對象的移動和動態效果控制。

.left-right {
position: relative;
animation-name: leftRight;
animation-duration: 2s;
animation-fill-mode: forwards;
}
@keyframes leftRight {
0% {
transform: translate(0, 0);
}
50% {
transform: translate(-50px, 0);
}
100% {
transform: translate(0, 0);
}
}

上述代碼展示了如何實現一個左右擺的動畫效果。首先定義了一個名為“left-right”的CSS類，在其中使用了“animation-name”、“animation-duration”和“animation-fill-mode”三個屬性定義動畫的名稱、時間和返回前一狀態的方式。接下來，使用“@keyframes”定義動畫的具體過程，通過“transform”函數實現從左到右的移動和返回原點，最終完成左右擺動畫效果的呈現。

當您想要為網站添加更多動態效果時，這種CSS左右擺動畫是不錯的選擇?？梢酝ㄟ^改變動畫的時間、變形和運動路徑等屬性，使動態效果更具創意和設計感。