最近我學習了CSS3中的動畫，對它的強大功能深感震撼。于是，我嘗試寫了一個簡單的動畫，讓一個元素在頁面中上下移動。

/* 定義動畫 */
@keyframes upDown{
0%{top: 100px;}
50%{top: 50px;}
100%{top: 100px;}
}
/* 設置元素樣式及動畫 */
.element{
position: absolute;
width: 50px;
height: 50px;
background-color: blue;
animation: upDown 2s ease-out infinite;
}

上述代碼中，我們首先定義一個名為upDown的動畫，它在0%時，元素距離頁面上邊緣100px的位置；在50%時，元素距離上邊緣50px的位置；在100%時，元素回到初始的100px上方。注意，這里的百分比表示的是動畫的進度，而非實時的時間。

接著，我們將.upDown應用到元素上，使其產生上下移動的動畫效果。其中，2s表示動畫執行的時間，ease-out表示動畫結束時的緩動效果，infinite表示動畫將無限執行下去。

通過學習動畫及其相關屬性，我們可以為網頁增添更多的趣味性、創意性，從而提升用戶體驗。