CSS循環執行動畫可以通過使用CSS3中的動畫屬性實現，這些屬性包括animation、animation-name、animation-duration、animation-timing-function、animation-delay、animation-iteration-count和animation-direction等。在這篇文章中，我們將使用animation屬性來創建一個基于CSS的循環執行動畫。

.animated {
animation-name: example;
animation-duration: 2s;
animation-timing-function: linear;
animation-delay: 0s;
animation-iteration-count: infinite;
animation-direction: alternate;
}
@keyframes example {
0% {
transform: translateX(0);
}
100% {
transform: translateX(100%);
}
}

上面的代碼可以創建一個無限循環的CSS動畫效果，其中animation-name屬性指定動畫的名稱為example，animation-duration屬性設置動畫執行時間為2秒，animation-timing-function屬性設置動畫速度為線性，animation-delay屬性設置動畫開始時間為0秒，animation-iteration-count屬性設置動畫執行次數為無限次，animation-direction屬性設置動畫方向為交替方向，表示在一次循環結束后，動畫方向會反轉。

在@keyframes規則中，我們使用了transform屬性來實現動畫效果，其中translateX函數可以實現元素水平方向的移動效果。在0%和100%兩個關鍵幀中，我們使用不同的transform值來分別表示元素在動畫開始時和結束時的狀態。

總之，通過使用CSS的animation屬性和@keyframes規則，我們可以很容易地創建循環執行的CSS動畫效果。開始嘗試吧！