Specifies the length of time to complete one cycle of the animation.
This property is read/write.
![]() |
Syntax
animation-duration:
<time>
[ ,
<time>
] *
Property values
One or more transition times, separated by commas.
- time
-
Floating-point number, followed by a time units designator ("ms" or "s"). For more information about the supported time units, see CSS Values and Units Reference.
CSS information
| Applies To | block-level and inline-level elements |
|---|---|
| Media | visual |
| Inherited | no |
| Initial Value | 0 |
Standards information
- CSS Animations Module Level 3, Section 3.3
Remarks
Each animation-duration property is paired with a corresponding animation-name property.
If more animation-duration values are declared than corresponding animation-name values, the excess animation-duration values are ignored.
If fewer animation-duration values are declared than corresponding animation-name values, the list of animation-duration values is repeated from the beginning until the animation-name values are exhausted.
To learn more about Cascading Style Sheets (CSS) animations, see How to bring your webpage to life with CSS transforms, transitions, and animations.
See also
- CSSStyleDeclaration
- currentStyle
- style
- a
- abbr
- b
- bdo
- br
- cite
- code
- em
- i
- img
- input
- kbd
- label
- q
- samp
- select
- small
- span
- strong
- sub
- sup
- textArea
- var
- address
- blockQuote
- div
- dl
- fieldSet
- form
- ol
- p
- pre
- table
- ul
- dd
- dt
- li
- tBody
- td
- tFoot
- th
- tHead
- tr
- button
- del
- ins
- map
- object
- script
- How to bring your webpage to life with CSS transforms, transitions, and animations
- Internet Explorer 10 Guide for Developers: CSS Animations
Build date: 11/29/2012
