CSS3動畫不循環是指動畫在執行一次后停止，不再重復執行。在實際開發中，我們有時需要這樣的動畫效果，下面來介紹一下如何實現。

.animation{
animation: myAnimation 1s;
animation-iteration-count: 1;
}
@keyframes myAnimation{
from {transform: translateX(0);}
to {transform: translateX(100px);}
}

上面的代碼實現了一個向右移動100像素的動畫，animation-iteration-count屬性設置為1，表示動畫只執行一次。如果需要讓動畫自動執行，可以使用JavaScript動態添加類名實現。

.animation{
animation: myAnimation 1s;
}
@keyframes myAnimation{
from {transform: translateX(0);}
to {transform: translateX(100px);}
}
.play{
animation-iteration-count: 1;
}

在JavaScript中，添加.play類名可以觸發動畫執行一次。

const box = document.querySelector('.animation');
box.classList.add('play');

這樣就實現了CSS3動畫不循環的效果。在實際開發中，根據需求靈活運用這些屬性和方法可以創造出豐富多彩的動畫效果。