CSS3中的過(guò)渡效果為我們帶來(lái)了更為生動(dòng)、有趣的頁(yè)面呈現(xiàn)方式。這里介紹一個(gè)讓過(guò)渡效果無(wú)限循環(huán)的方法。

首先，我們需要定義一個(gè)CSS3的過(guò)渡效果：

.transition {
transition: all 1s ease-in-out;
}

接著，我們需要對(duì)該元素在過(guò)渡結(jié)束時(shí)的狀態(tài)進(jìn)行設(shè)置，這里我們假設(shè)是將元素的顏色從藍(lán)色漸變?yōu)榧t色：

.transition:hover {
background-color: red;
}

現(xiàn)在，我們需要將這個(gè)過(guò)渡效果進(jìn)行無(wú)限循環(huán)。這可以通過(guò)JavaScript實(shí)現(xiàn)：

var element = document.querySelector('.transition');
element.addEventListener('transitionend', function() {
element.classList.remove('transition');
void element.offsetWidth;
element.classList.add('transition');
});

代碼解釋：

1. 首先，我們獲取了含有過(guò)渡效果的元素。
2. 然后，我們給該元素設(shè)置了一個(gè)事件監(jiān)聽(tīng)器，當(dāng)過(guò)渡效果結(jié)束時(shí)，會(huì)觸發(fā)該事件。
3. 在事件處理函數(shù)中，我們先將過(guò)渡效果去掉（即去掉class），然后使用void操作符強(qiáng)制瀏覽器重新渲染該元素，最后再重新添加上過(guò)渡效果。

這樣，我們就實(shí)現(xiàn)了CSS3過(guò)渡效果的無(wú)限循環(huán)效果。