CSS3動畫是網頁設計中非常重要的一部分，它可以讓元素以更加生動的方式展示在用戶面前，增強用戶的體驗感。今天我們將講解如何使用CSS3動畫實現對號的效果。

/* 設置對號的樣式 */
.checkmark {
width: 30px;
height: 30px;
border-radius: 50%;
border: 2px solid #999;
position: relative;
overflow: hidden;
}
.checkmark::before {
content: '';
position: absolute;
top: 50%;
left: 25%;
width: 5px;
height: 10px;
border: 2px solid #999;
border-top: none;
border-right: none;
transform: rotate(45deg);
animation: checkmark 0.5s ease-in-out;
}
.checkmark::after {
content: '';
position: absolute;
top: 50%;
left: 35%;
width: 5px;
height: 10px;
border: 2px solid #999;
border-top: none;
border-right: none;
transform: rotate(-45deg);
animation: checkmark 0.5s ease-in-out;
}
/* 定義對號動畫 */
@keyframes checkmark {
from {
height: 0;
}
to {
height: 10px;
}
}

以上代碼定義了對號的樣式，并使用了CSS3動畫實現對號的繪制過程。在HTML中插入checkmark類名的元素即可呈現出對號的效果。

CSS3動畫不僅可以實現簡單的動效，還可以實現復雜的效果，比如過渡、動畫序列等。學習CSS3動畫，可以讓我們的網頁設計更加生動、有趣，更容易吸引用戶的注意力。希望大家能夠多多嘗試，不斷提升自己的技術水平。