CSS可以很容易地實現有趣的動畫效果，例如畫運動軌跡。

實現這一效果的關鍵是使用CSS的animation屬性。我們可以在<pre>標簽中編寫以下代碼：
.box { width: 50px; height: 50px; border-radius: 50%; background-color: red; animation: move 3s linear infinite; } @keyframes move { 0% { transform: translateX(0); } 100% { transform: translateX(200px); } }

上面的代碼中，我們創建了一個名為“move”的關鍵幀動畫。這個動畫包含了從0%到100%的動畫狀態，其中從0%到100%的時間段會用于循環播放動畫（infinite屬性）。

在.盒子的樣式中，我們將動畫屬性應用到了盒子中。該動畫的名稱是“move”，它將持續3秒，并使用linear的時間函數來平滑地過渡。

在關鍵幀中，我們在0%和100%的狀態之間使用了transform屬性。在0%狀態下，盒子將初始位置（translateX（0））保留在其位置，而100%狀態下，它將在X軸上從當前位置向右移動200px（translateX（200px））。這樣，就產生了一個平滑的動畫效果，仿佛盒子像火車在軌道上移動。

通過以上代碼，我們展示了如何使用CSS畫出一個動感十足的運動軌跡。這是一個有趣的動畫效果，既可以用于網頁裝飾，也可以用于增強用戶體驗。