CSS3動(dòng)畫中，Top屬性用來定義元素頂部位置的值。Top屬性可以配合動(dòng)畫效果使用，在元素做動(dòng)畫時(shí)改變?cè)仨敳课恢玫闹担乖爻尸F(xiàn)出上下移動(dòng)的效果。

#box{
position: relative;
top: 0;
animation: jump 1s infinite;
}
@keyframes jump{
0%{top: 0;}
50%{top: -50px;}
100%{top: 0;}
}

上述代碼中，我們先定義了一個(gè)元素#box，并設(shè)置其初始頂部位置為0。接著，我們定義一個(gè)名為jump的關(guān)鍵幀動(dòng)畫，該動(dòng)畫在1秒內(nèi)無限循環(huán)，通過控制元素的top屬性，讓元素從0位置開始向上50像素再向下50像素，形成上下跳躍的效果。

除了使用關(guān)鍵幀動(dòng)畫之外，我們還可以使用CSS3過渡效果來實(shí)現(xiàn)top的動(dòng)畫效果。

#box{
position: relative;
top: 0;
transition: top 0.5s ease-in-out;
}
#box:hover{
top: -50px;
}

在上述代碼中，我們同樣定義了一個(gè)元素#box，并設(shè)置其初始頂部位置為0。我們還定義了一個(gè)過渡效果，該效果會(huì)在0.5秒內(nèi)使元素的top值變化，采用了緩動(dòng)函數(shù)ease-in-out。當(dāng)鼠標(biāo)懸浮在#box上時(shí)，top屬性值改變?yōu)?50px，從而使元素向上移動(dòng)50像素。

總結(jié)來說，top屬性在CSS3動(dòng)畫中可以通過關(guān)鍵幀動(dòng)畫和過渡效果來呈現(xiàn)出不同的效果，通過變化top屬性值，從而控制元素的上下移動(dòng)。