CSS是前端開發(fā)中常用的樣式定義語言，它可以實現(xiàn)我們各種花式的界面效果，其中一個常見的小動畫效果就是用CSS制作小球跳動效果。

/* CSS代碼 */
.ball {
position: absolute;
top: 50px;
left: 50px;
width: 50px;
height: 50px;
border-radius: 50%;
background-color: red;
animation: jump 1s infinite alternate;
}
/* 定義小球跳動動畫 */
@keyframes jump {
from {
top: 50px;
}
to {
top: 200px;
}
}

以上代碼就是一個簡單的用CSS制作小球跳動效果的例子。

首先我們定義了一個具有圓形樣式的ball類，通過position屬性和top、left屬性的定位，將小球放在頁面的指定位置上。

接著，我們利用CSS3提供的動畫技術(shù)，通過animation屬性定義了一個名為“jump”的動畫，使得小球在約1秒鐘的時間內(nèi)，從初始位置向下移動，到達目標位置，然后以同樣的速度回到初始位置，如此反復(fù)循環(huán)。

最后，我們在@keyframes語句塊中定義了一系列關(guān)于小球位置的變化規(guī)則，通過from和to關(guān)鍵字，定義了小球從縱向位置50px開始移動，向下跳躍到200px的位置，然后再次向上跳躍回到50px的位置。這樣連續(xù)跳躍反復(fù)循環(huán)，就制作了小球跳動的動態(tài)效果。

總結(jié)來說，通過CSS制作小球跳動效果，需要使用position和動畫animation屬性，以及通過@keyframes語句塊進行關(guān)鍵幀的定義和規(guī)定位置變化的動畫效果。