CSS動畫是網頁設計中非常重要的一部分，它可以使靜態的網頁變得更加生動有趣。通過CSS屬性和動畫屬性的控制，我們可以實現各種各樣的動態效果。

/* CSS代碼 */
.ele{
animation: myAnimation 2s linear infinite;
}
@keyframes myAnimation{
0%{
transform: translateX(0px);
}
100%{
transform: translateX(200px);
}
}

在CSS的代碼塊中，我們可以使用animation屬性來定義動畫，其后跟著動畫的名稱、時間、動畫速度曲線和重復次數等屬性。在動畫的定義中，我們使用了@keyframes關鍵字，用于定義動畫播放過程中各個階段的狀態。

借助這些屬性，我們可以實現移動、縮放、旋轉、改變透明度等各種動畫效果。例如使用transform: translateY(-50%)可以將一個元素向上移動其自身高度的50%。

/* CSS代碼 */
.ele:hover{
transform: scale(1.2);
opacity: 0.7;
}

除此之外，我們還可以通過CSS的hover偽類實現鼠標懸停時的動畫效果。如上代碼所示，鼠標懸停在元素上時會使其放大并改變透明度。

總之，CSS控制的動畫可以提升網頁設計的體驗感，增強用戶對網站的粘性。懂得如何控制動畫屬性將對設計師非常有幫助。