CSS animation-duration property
Description
CSS animation-duration property defines the total duration of one animation cycle only. We take an example of animation with different values of animation-duration.
Negative values are not allowed.
Syntax
animation-duration : +ve value (seconds or milliseconds)
Property values
+ve value (seconds)Default
-
This value determines the duration of a single animation cycle. 1s means the cycle completes its life cycle within 1s.
animation-duration: 1s;
+ve value (seconds)
-
This value determines the duration of an animation cycle. If the value is 0s, the animation occurs instantly for 0s.
animation-duration: 0s;
+ve fractional value (seconds)
-
The animation-duration also accepts fractional values. For example, the animation can continue for 2.5s.
animation-duration: 2.5s;
+ve value (milliseconds)
-
It also accepts value in milliseconds. For example, the animation continues for 2000ms i.e. 2s.
animation-duration: 2000ms;
Applicable to
It applies to all elements
From web4college, the free CSS digger
Bookmark this page
Ctrl+D
