CSS是一種用于網頁樣式設計的語言。其中，利用鼠標事件在HTML元素上綁定CSS屬性，可以實現一些非常好玩的特效。今天，我們要介紹的就是如何在鼠標經過后暫停元素的動畫效果。

.demo {
width: 100px;
height: 100px;
background-color: #ff0000;
position: relative;
animation: rotate 2s linear infinite;
}
@keyframes rotate {
0% {transform: rotate(0deg);}
100% {transform: rotate(360deg);}
}
.demo:hover {
animation-play-state: paused; /* 鼠標懸浮后暫停動畫 */
}

在上述代碼中，我們定義了一個class為.demo的方塊，它會不斷地自我旋轉。有趣的是，當我們鼠標懸浮在方塊上時，動畫會暫停在當前幀，也就是我們停止懸浮所在的幀。

如此簡單的效果實現方法，你學會了嗎？快試試看吧！