애니메이션 재생 횟수를 설정하는 CSS3

CSS에서는 animation-iteration-count 속성을 사용하여 애니메이션 재생 횟수를 설정할 수 있습니다. 요소에 "animation-iteration-count: unlimited" 스타일을 설정하기만 하면 됩니다.

이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

animation-iteration-count 속성은 주로 애니메이션이 재생되는 횟수를 정의하는 데 사용됩니다.

구문 규칙:

animation-iteration-count: infinite | [, infinite | ]*

1. 값은 일반적으로 정수이지만 소수와 함께 숫자를 사용할 수도 있습니다. 기본값은 1입니다. 이는 애니메이션이 처음부터 끝까지 한 번만 재생된다는 의미입니다.

2. 값이 무한이면 애니메이션이 무한 재생됩니다.

예:

애니메이션 이동을 5번만 재생하려면 animation-iteration-count 속성을 사용하세요. 코드는 다음과 같이 설정됩니다.

animation-iteration-count:5;

참고: Chrome 또는 Safari 브라우저의 경우 -webkit- 접두사를 추가해야 합니다!

추천 학습: css 비디오 튜토리얼

위 내용은 애니메이션 재생 횟수를 설정하는 CSS3의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!