animation-duration
Baseline
Widely available
*
This feature is well established and works across many devices and browser versions. It’s been available across browsers since septiembre de 2015.
* Some parts of this feature may have varying levels of support.
Experimental: 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 inicial | 0s |
|---|---|
| Applies to | todos los elementos y los pseudoelementos ::before y ::after |
| Heredable | no |
| Valor calculado | como se especifica |
| Animation type | Not animatable |
Sintaxis
Gramatica formal:animation-duration =animation-duration: 6s animation-duration: 120ms animation-duration: 1s, 15s animation-duration: 10s, 30s, 230ms
[ auto | <time [0s,∞]> ]#
Valores
<time>-
El tiempo que tarda la animación en terminar su secuencia. Podemos especificarlo en segundos (usando
s) o milisegundos (usandoms). 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
| Specification |
|---|
| CSS Animations Level 1 # animation-duration |
Compatibilidad con navegadores
Loading…