Esta es una tecnología experimental
Comprueba la Tabla de compabilidad de navegadores cuidadosamente antes de usarla en producción.

Resumen

La propiedad CSS animation-duration indica la cantidad de tiempo que la animación tarda en completar un ciclo (duración).

El valor por defecto es 0s, que indica que la animación no debe producirse.

Es conveniente usar la propiedad abreviada animation para ajustar todas las propiedades de animación a la vez

Valor inicial0s
Applies totodos los elementos y los pseudoelementos ::before y ::after
Heredableno
Mediavisual
Valor calculadocomo se especifica
Animation typediscrete
Canonical orderel orden único no-ambigüo definido por la gramática formal

Sintaxis

Gramatica formal: <time>#
animation-duration: 6s
animation-duration: 120ms
animation-duration: 1s, 15s
animation-duration: 10s, 30s, 230ms

Valores

<time>
El tiempo que tarda la animación en terminar su secuencia. Podemos especificarlo en segundos (usando s) o milisegundos (usando ms). Si no especificamos la unidad, la sentencia no será válida.
Nota: No acepta valores negativos, si los ponemos la sentencia se ignorará. Algunas implementaciones antiguas (con prefijos) pueden considerar los valores negativos como si fueran 0s.

Ejemplos

Visitar CSS animations para ver algunos ejemplos.

Especificaciones

Especificación Estado Comentarios
CSS Animations
La definición de 'animation-duration' en esta especificación.
Working Draft  

Compatibilidad entre navegadores

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Característica Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 3.0-webkit 5.0 (5.0)-moz
16.0 (16.0)
10 12-o
12.10 #
4.0-webkit
Característica Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support 2.0-webkit 5.0 (5.0)-moz
16.0 (16.0)
Sin soporte Sin soporte 4.2-webkit

Consultar también

Etiquetas y colaboradores del documento

Colaboradores en esta página: teoli, Sebastianz, Luis_Calvo
Última actualización por: teoli,