The "transition" CSS Property

Shorthand

This shorthand property can set four transition properties.

Values for "transition"

CSS Level	Value
CSS Transitions	"<single-transition>#", where <single-transition> = "[ none | <single-transition-property> ] || <time> || <easing-function> || <time>"

Notes

• Order is important. The first value that can be parsed as a time is <transition-duration> and the 2nd that can be parsed as a time is <transition-delay>.
• So that transitions work in major browsers, be sure to use the "transition" property and the equivalent proprietary properties like "-moz-transition", "-ms-transition", "-o-transition", and "-webkit-transition".

Recommended Links

• CanIUse.com: Search "transition" (browser compatibility information)
• CanIEmail.com: Search "transition" (email client compatibility information)
• CSS3: transition property
• MDN: transition property
• Quackit: transition property

Search Engine Links (for more information)

• Bing "CSS transition property"
• Google "CSS transition property"