在網頁設計當中，動畫效果是很重要的元素之一。相信很多人都已經了解了HTML和JavaScript創建動畫的基礎知識，但是今天我們要來討論一下CSS是否能夠實現順序動畫。

<div class="wrapper">
<div class="box box1"></div>
<div class="box box2"></div>
<div class="box box3"></div>
</div>

如上代碼，我們在HTML中創建了一個包裹著三個擁有不同class名的盒子，這三個盒子最終都要執行同一個動畫move，但是動畫執行的時間和延遲不同，實現了順序動畫。

.box1 {
animation: move 2s;
}

在上方的代碼中我們定義了.box1盒子使用move動畫，執行時間為2s，這個盒子是順序動畫中最靠前的元素。

.box2 {
animation: move 2s 1s;
}

在上方的代碼中我們定義了.box2盒子使用move動畫，執行時間為2s，延遲時間為1s，也就是說從動畫開始到box2執行動畫還要等待1s。

.box3 {
animation: move 2s 2s;
}

在上方的代碼中我們定義了.box3盒子使用move動畫，執行時間為2s，延遲時間為2s，也就是說從動畫開始到box3執行動畫還要等待2s。

通過以上的代碼分析，可以得出結論：CSS可以實現順序動畫。通過設置animation屬性的延遲時間可以很容易地控制元素動畫的順序和時間。