0 FPS
Propiedad CSS : transition
La web está en segundo plano, animación en pausa.
Cargando animación...
Propiedad corta que nos permite especificar las propiedades transition-delay, transition-duration, transition-timing-function, y transition-property.
Las transiciónes se suelen utilizar para el selector
:hover, aunque tambien se pueden utilizar para el selector :active.Sintaxis
transition: transition-property transition-duration transition-timing-function transition-delay;
| transition-property | Especifica la propiedad que se usará en la transición. Por defecto es all. |
| transition-duration | Especifica el tiempo que necesitara la transición para completarse en segundos(s) o milisegundos(ms). Por defecto es 0. |
| transition-timing-function | Especifica la curva de velocidad que se usará para la transición. Por defecto es ease. |
| transition-delay | Especifica el tiempo que tardará en arrancar la transición. Por defecto es 0. |
Si deseas especificar mas de una propiedad para la transición, debes separarlas por una coma, ademas tambien tienes que especificar como minimo la duración para esa propiedad en concreto. Por ejemplo :
Fijate que en el parámetro height no he especificado ni el timing-function ni el delay, por lo que tomaran los valores por defecto
transition:width 5s linear 0s, height 5s;.Fijate que en el parámetro height no he especificado ni el timing-function ni el delay, por lo que tomaran los valores por defecto
ease 0s.Código de ejemplo
Compatibilidad
Esta propiedad es soportada por todos los navegadores compatibles con CSS3.
| Soportado a partir de la versión 26 | |
| Soportado a partir de la versión 16 | |
| Soportado a partir de la versión 12 | |
Soportado a partir de la versión 3 con el prefijo -webkit- | |
| Soportado a partir de la versión 10 |
Documento modificado por última vez : 30/12/2020
Ejemplo modificado por última vez : 30/12/2020
Ejemplo modificado por última vez : 30/12/2020