CSS是一種樣式表語言，能夠使網頁更加美觀和易于閱讀。本文將介紹如何使用CSS來實現一個上下彈動的小球。

.ball {
position: relative;
animation: bounce 1s infinite alternate;
}
@keyframes bounce {
0% { top: 0; }
100% { top: 50px; }
}

首先，我們需要創建一個球的HTML元素，并用CSS將其定位：

<div class="ball"></div>

接下來，我們將創建一個CSS動畫，使用CSS3中的關鍵幀。我們將創建一個名為“bounce”的鍵幀動畫，將使球在網頁上上下彈跳。

我們將使用“position: relative”來將球移動到頁面上，并使用“animation”屬性來將其引用到我們的“bounce”動畫中。此外，我們將使用“infinite alternate”屬性來使球在上下移動期間無限循環。

最后，我們將在“bounce”鍵幀動畫中定義兩個關鍵幀。在第一個關鍵幀中，我們將球的位置設置為0，而在第二個關鍵幀中，我們將其設置為50像素。由于我們沒有定義任何持續時間，因此我們可以自由地控制球的上下彈跳速度。

最終的CSS代碼如下所示：

.ball {
position: relative;
animation: bounce 1s infinite alternate;
}
@keyframes bounce {
0% { top: 0; }
100% { top: 50px; }
}

這就是如何使用CSS實現一個上下彈動的小球。您可以根據需要調整動畫時間和球的大小，以適應您的網站設計。