左右抖動動畫可以為網站增添活力，讓用戶更加愉悅和舒適。下面我們來學習如何使用CSS代碼實現左右抖動動畫效果。

/* CSS代碼實現左右抖動動畫效果 */
/* 定義一個class名為shake，設置動畫屬性 */
.shake{
animation: shake 0.5s ease-in-out infinite alternate;
}
/* 定義動畫，名稱為shake */
@keyframes shake{
from{ transform: translateX(-10px);}
to{ transform: translateX(10px);}
}

解析：首先定義一個類名為shake，然后設置CSS動畫，其中animation屬性設置的是shake動畫，持續時間為0.5秒，緩入緩出效果并且無限循環，alternate是讓其反向動畫，即來回擺動。在下面的keyframes動畫中使用了transform屬性，分別是從左側向右側移動10像素和從右側向左側移動10像素，即實現左右抖動的效果。

在頁面對需要添加抖動效果的元素加上class名為“shake”的屬性即可。