This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for the proper prefixes to use in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the spec changes.
Resumen
La propiedad CSS animation-name especifica una lista de animaciones que se deben aplicar al elemento seleccionado. Cada nombre indica un @keyframes
esta regla define los valores de las propiedades de la secuencia de animación.
A menudo es conveniente utilizar la propiedad abrevieda animation
para ajustar todas las propiedades de animación a la vez.
Valor inicial | none |
---|---|
Applies to | todos los elementos y los pseudoelementos ::before y ::after |
Heredable | no |
Media | visual |
Valor calculado | como se especifica |
Animatable | no |
Canonical order | el orden único no-ambigüo definido por la gramática formal |
Sintaxis
Sintaxis formal: <single-animation-name>#where
<single-animation-name> = none | IDENT
animation-name: none; animation-name: test_05; animation-name: -specific; animation-name: sliding-vertically; animation-name: test1; animation-name: test1, animation4; animation-name: none, -moz-specific, sliding; animation-name: initial; animation-name: inherit; animation-name: unset;
Valores
<single-animation-name>
es una de las siguientes palabras clave:
none
- Es una palabra clave especial que denota que no hay fotogramas (keyframes) clave. Se puede utilizar para desactivar una animación sin cambiar el orden de los otros identificadores, o para desactivar animaciones procedentes de las cascada.
<custom-ident>
- Cadena que identifica la animación. Este identificador está compuesto por una combinación de letras mayúsculas y minúsculas de la "A"a la "Z", números del 0 al 9, guiones bajos "_" y/o guiones "-". el primer caracter siempre debe ser una letra, ni un numero, excepto un guión (no se pueden poner dos guiones seguidos o más al principio del nombre.) No puede usarse
none
,unset
,initial
, oinherit
ni ninguna combinación de estos casos.
Ejemplos
Ver ejemplos CSS animations.
Especificaciones
Especificación | Estado | Comentario |
---|---|---|
CSS Animations The definition of 'animation-name' in that specification. |
Working Draft |
Compatibilidad en navegadores
Características | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Soporte básico | (Yes)-webkit | 5.0 (5.0)-moz 16.0 (16.0) |
10 | 12 -o 12.10 # |
4.0-webkit |
Características | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Soporte básico | (Yes)-webkit | 5.0 (5.0)-moz 16.0 (16.0) |
10 | ? | ? |