Manual de referencia CSS

reglas CSS @

大全 de Atributos CSS

CSS3 transition-timing-Atributo function CSS3 transition-Atributo duration

CSS3 transition-Uso y ejemplo de la propiedad property

transition-La propiedad CSS especifica el nombre de la propiedad CSS a la que se debe aplicar el efecto de transición.

La siguiente tabla describe el uso y el historial de versiones de esta propiedad, así como la sintaxis de uso en el script JavaScript.

Valor predeterminado：	all
Aplique a：	Todos los elementos::before y::after Elementos pseudo
Herencia：	No
Animable:	No.Ver Atributos de animación。
Versión：	CSS3nuevas características
Sintaxis de JavaScript：	object.style.transitionProperty="width,height"

transition-Sintaxis de uso de property

La sintaxis de esta propiedad es la siguiente：

transition-La sintaxis del atributo property:　　[,　, ... ]　|　none　|　all　|　initial　|　inherit
　donde　　es el nombre de una propiedad CSS

El siguiente ejemplo muestra cómo usar transition-property atributo.

Ejemplo

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

Prueba y mira‹/›

Valor del atributo

La siguiente tabla describe los valores de esta propiedad.

Valor	Descripción
none	Ninguna propiedad obtendrá el efecto de transición.
all	Todas las propiedades obtendrán el efecto de transición. Este es el valor predeterminado.
initial	Establezca este atributo en su valor predeterminado.
inherit	Si se especifica, el elemento asociado adopta la transición del elemento padre.-El valor del atributo property.

Compatibilidad del navegador

transition-La compatibilidad del navegador del atributo property, los números en la siguiente tabla representan la versión mínima del navegador que admite esta propiedad; todos los navegadores principales admiten esta propiedad.

	Firefox 4+ ^-moz-，16 + Google Chrome 4+ ^-webkit-，26 + Internet Explorer 10+ Apple Safari 3.1+ ^-webkit-，6.1+ Opera 10.5+ ^-o-，12.1+

Leer más

Consulte los siguientes tutoriales：CSS3 Transiciones。

Propiedades relacionadas：transition，transition-delay，transition-duration，transition-timing-function。

CSS3 transition-timing-Atributo function CSS3 transition-Atributo duration