CSS3是前端開發中的一個重要技術，其中動畫也是最為常見的應用之一。那么，CSS3用什么來創建動畫呢？下面我們來一起學習。

1. transition
transition是CSS3提供的一個屬性，可以在元素發生變化時產生平滑的過渡動畫效果。使用transition制作動畫不需要過多的代碼，只需要定義中間狀態，CSS3會自動完成動畫過渡。
例如：
.box {
width: 100px;
height: 100px;
background-color: #f00;
transition: width 2s ease-in-out;
}
.box:hover {
width: 200px;
}
當元素狀態變化時，它的width屬性值從100px變為200px，變化過程持續2秒，并以ease-in-out（先緩沖后緩沖）的方式執行過渡動畫。
2. animation
animation是CSS3提供的屬性，具有比transition更加豐富的屬性和功能。它可以在元素變化時產生高度自定義的動畫效果。使用animation需要定義關鍵幀，對于每一幀的樣式和持續時間都可以自定義。
例如：
.box {
width: 100px;
height: 100px;
background-color: #f00;
animation: myAnimation 2s linear infinite;
}
@keyframes myAnimation {
0% {
width: 100px;
}
50% {
width: 200px;
}
100% {
width: 100px;
}
}
元素在持續的2秒間內，以線性的方式無限循環播放myAnimation動畫。在myAnimation中，定義了三個關鍵幀，即0%、50%、100%，這些關鍵幀分別定義了元素在不同時刻的樣式。
3. transform
transform是CSS3提供的屬性，可以對元素進行旋轉、縮放、偏移等變換，同時也可以結合animation和transition屬性制作動畫效果。
例如：
.box {
width: 100px;
height: 100px;
background-color: #f00;
}
.box:hover {
transform: rotate(360deg);
transition: transform 2s ease-in-out;
}
鼠標懸浮在.box元素上時，元素將以360度旋轉，在2秒間完成變換，并以ease-in-out的方式過渡實現。
以上三個CSS3屬性都可以用來制作動畫效果，目前這些屬性幾乎被所有主流瀏覽器支持，使用起來也比較簡單。我們可以結合實際需求選擇合適的方法，制作出優雅、流暢的動畫效果。