CSS3動畫是CSS3新增的一種樣式，可以實現網頁的動態效果。CSS3動畫源是CSS3提供的一種方法，它可以讓開發者更加快速簡單地進行CSS3動畫的編寫。下面來介紹一下CSS3動畫源。

/*定義動畫名稱*/
@keyframes example {
/*設定動畫不同時間點的樣式*/
0%   {background-color:red; left:0px; top:0px;}
25%  {background-color:yellow; left:200px; top:0px;}
50%  {background-color:blue; left:200px; top:200px;}
75%  {background-color:green; left:0px; top:200px;}
100% {background-color:red; left:0px; top:0px;}
}
/*應用動畫*/
div {
width: 100px;
height: 100px;
position: relative;
animation-name: example;
animation-duration: 4s;
}

上面的代碼演示了如何使用CSS3動畫源來定義和應用一個簡單的動畫。代碼中@keyframes定義了動畫名稱和不同時間點的樣式，div元素則通過設置animation-name屬性將該動畫應用到自身，并且通過animation-duration設置動畫的持續時間。當動畫播放時，div元素會根據不同時間點的樣式逐步過渡，形成一個流暢的動態效果，如下圖所示：

+---------------------------+
|                           |
| +----------+              |
| |          |              |
| |          |              |
| |          |              |
| |          | +------+     |
| |          | |      |     |
| +----------+ |      |     |
|              +------+     |
|                           |
+---------------------------+

CSS3動畫源擁有簡單易學的特點，使得CSS3動畫編寫變得更加簡單和方便。在實際開發中，我們可以根據不同的需求結合HTML元素的特點，使用CSS3動畫源來為網頁添加各種動態效果，使網頁更加生動有趣。