How to set and execute css3 animation once

In CSS3, you can use the animation-iteration-count attribute to set the animation to be executed once. The function of this attribute is to define the number of times the animation is played; when the value of the animation-iteration-count attribute is set to the number "1" , you can set the animation to play only once.

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

In CSS3, you can use the animation-iteration-count attribute to set the animation to execute once.

The animation-iteration-count attribute can define the number of times the animation is played and set how many times the animation should be played.

Syntax:

animation-iteration-count: value;

Example:

Set the animation to play only once

Modify it and set the animation to play 3 times

div { width: 100px; height: 100px; background: red; position: relative; animation: mymove 3s; animation-iteration-count: 3; /* Safari and Chrome */ -webkit-animation: mymove 3s; -webkit-animation-iteration-count: 3; }

（Learning video sharing:css video tutorial）

The above is the detailed content of How to set and execute css3 animation once. For more information, please follow other related articles on the PHP Chinese website!