在CSS中,您可以使用animation
屬性來(lái)定義和執(zhí)行動(dòng)畫(huà),要執(zhí)行多次,您可以使用animation-iteration-count
屬性來(lái)指定動(dòng)畫(huà)的循環(huán)次數(shù)。
假設(shè)您有一個(gè)名為my-animation
的動(dòng)畫(huà),您希望它執(zhí)行3次,您可以這樣寫(xiě):
.my-element { animation: my-animation 5s; animation-iteration-count: 3; }
在上面的代碼中,my-animation
動(dòng)畫(huà)會(huì)在.my-element
元素上執(zhí)行3次,每次持續(xù)5秒。
animation-iteration-count
屬性的值可以是具體的數(shù)字,也可以是infinite
,表示動(dòng)畫(huà)會(huì)無(wú)限循環(huán)。
您還可以使用animation-delay
屬性來(lái)指定動(dòng)畫(huà)在每次循環(huán)之間的延遲時(shí)間,如果您希望動(dòng)畫(huà)在每次循環(huán)之間有1秒的延遲,您可以這樣寫(xiě):
.my-element { animation: my-animation 5s; animation-iteration-count: 3; animation-delay: 1s; }
在上面的代碼中,my-animation
動(dòng)畫(huà)會(huì)在.my-element
元素上執(zhí)行3次,每次持續(xù)5秒,并且在每次循環(huán)之間有1秒的延遲。