Table of Contents

Shift between two CSS values in style and save time with the transition shorthand:

				
					
transition: margin-top 1s ease-in-out 0.5s;

Is equivalent to this:

				
					
transition-property: margin-top;

transition-duration: 1s;

transition-timing-function: ease-in-out;

transition-delay: 0.5s;

Use all as the property to affect all values at once. Define multiple transitions in the shorthand using comas:

				
					
.box {

  transition: margin-top 1s linear,

  margin-bottom 0.5s cubic-bezier(0,1.18,.87,.32),

  margin-left 2s;

}