manual de referencia CSS

CSS @reglas (RULES)

大全 de propiedades CSS

CSS3 Transición-Atributo propiedad CSS3 Transición-Atributo delay

CSS3 Transición-Método de uso y ejemplo del atributo duration

Transición-El atributo duration CSS especifica el número de segundos o milisegundos necesarios para completar la animación de transición.

La tabla siguiente proporciona la descripción de uso y el historial de versiones de este atributo, así como la sintaxis de uso en el script JavaScript.

Valor predeterminado:	0s
Aplicable a:	Todos los elementos::before y::after Elemento pseudo
Herencia:	No
Animable:	No.Ver también Atributo de animación.
Versión:	CSS3nueva característica
Sintaxis de JavaScript:	objeto.style.transitionDuration="5s"

Transición-Sintaxis de uso de duration

La sintaxis de este atributo es la siguiente:

Transición-duration: tiempo | initial | inherit

El siguiente ejemplo muestra cómo usar transition-Atributo duration

Ejemplo

button {
　　　　background: #fd7c2a;
　　　　/*　Para Safari　3.0+　*/
　　　　-webkit-Transición-property: background;
　　　　-webkit-Transición-duration:　2s;
　　　　
　　　　Transición-property: background;
　　　　Transición-duration:　2s;
}
button:hover {
　　　　background: #3cc16e;
}

Ver aquí‹/›

Valor del atributo

La tabla siguiente describe los valores de este atributo.

Valor	Descripción
Tiempo	Especificar el tiempo necesario para completar la transición. El valor predeterminado es 0s. Los valores negativos no son válidos.
initial	Establecer este atributo en su valor predeterminado.
inherit	Si se especifica, el elemento asociado utiliza la propiedad transition de su elemento padre-Valor del atributo duration.

Compatibilidad del navegador

Transición-Compatibilidad del navegador del atributo duration; los números en la tabla siguiente representan la versión mínima de los navegadores que admiten esta propiedad; todos los navegadores principales admiten esta propiedad.

	Firefox 5+ ^-moz-,15 + Google Chrome 4+ ^-webkit- Internet Explorer 10+ Apple Safari 4+ ^-webkit- Opera 12+ ^-o-,15+ ^-webkit-

Leer más

Consulte los siguientes tutoriales:CSS3 Transiciones.

Propiedades relacionadas:Transición,Transición-Delay,Transición-Propiedad,Transición-Timing-Función.

CSS3 Transición-Atributo propiedad CSS3 Transición-Atributo delay