CSS3 `transition-property` Attribute

Example

Hover the mouse over a div element to gradually change the width of the table:

Browser Support

The numbers in the table specify the first browser version that fully supports the attribute.

Numbers preceding -webkit-, -ms-, or -moz- indicate the first browser version that supports the prefixed attribute.

Property
transition-property	26.0 <br>4.0 -webkit-	10.0	16.0 <br>4.0 -moz-	6.1 <br>3.1 -webkit-	12.1 <br>10.5 -o-

Property Definition and Usage

The transition-property attribute specifies the name of the CSS property to which the transition effect is applied (the transition effect will be triggered when the specified CSS property changes).

Tip: A transition effect usually occurs when the user hovers the mouse over an element.

Note: Always specify the transition-duration property, otherwise the duration is 0, and the transition will have no effect.

Default value:	all
Inherited:	no
---	---
Version:	CSS3
---	---
JavaScript syntax:	object.style.transitionProperty="width,height"
---	---

Syntax

Value	Description
none	No properties will get a transition effect.
all	All properties will get a transition effect.
property	Defines a comma-separated list of CSS property names to which the transition effect is applied.

More Examples

Transition Effect - Change Two Properties