CSS3+畫圓動畫

.circle{
width: 100px;
height: 100px;
border-radius: 50%;
background-color: #FF5722;
animation: circleRotate 2s linear infinite;
}
@keyframes circleRotate{
0%{
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100%{
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}

CSS3提供了我們許多強大的動畫效果，讓網頁變得更加美觀動感。其中，畫圓動畫可以給我們帶來很多驚喜。

我們首先需要通過border-radius屬性來定義元素為圓形。然后，添加background-color屬性來設置圓形的顏色。接著，我們就可以通過CSS3動畫來實現畫圓動畫的效果了。

這里我們選取了animation、keyframes、transform等CSS3新特性來定義畫圓動畫。我們在circleRotate中創建了兩個關鍵幀：0%和100%。通過設置初始狀態和結束狀態，我們可以使整個元素在2秒內順時針旋轉360度，達到畫圓的效果。

最后，我們將class為.circle的元素添加畫圓動畫即可。