CSS3是一門強大的樣式語言，它可以為網頁設計師和開發者提供許多有趣的效果。其中之一就是圓圈放大縮小動畫，這種效果可以為網頁添加一些活力和動感。

.circle{
width:50px;
height:50px;
border-radius:50%;
background:#ff0000;
position:relative;
animation:scale 1s infinite;
}
@keyframes scale{
0%{
transform:scale(1);
box-shadow:0 0 0 0 rgba(0,0,0,0.7);
}
70%{
transform:scale(1.2);
box-shadow:0 0 0 10px rgba(0,0,0,0);
}
100%{
transform:scale(1);
box-shadow:0 0 0 0 rgba(0,0,0,0);
}
}

上面的代碼中使用了一個名為.circle的class來創建一個圓圈形狀。接下來，我們使用animation屬性來為圓圈添加一個名為scale的動畫效果，并且設置其持續時間為1s，無限循環。

接下來，我們通過關鍵幀@keyframes指定了所需的動畫效果。具體來說，我們使用了三個關鍵幀：

• 0%：表示動畫開始時的狀態，此時圓圈大小與陰影都為0。
• 70%：表示達到最大尺寸時的狀態，此時圓圈放大到1.2倍大小，陰影消失。
• 100%：表示動畫結束時的狀態，此時圓圈恢復到原始大小，陰影仍為0。

當我們將代碼復制到HTML文件中后，在需要使用的地方添加一個

<div class="circle"></div>