css

Multiple changes:
 To add a transitional effect for more than one style, add more properties, separated by commas:
Sytax:   Add effects on the width, height, and the transformation:
 div{
 transition: width 2s, height 2s, transform 2s;
 -moz-transition: width 2s, height 2s, -moz-transform 2s;
 -webkit-transition: width 2s, height 2s, -webkit-transform 2s;
 -o-transition: width 2s, height 2s,-o-transform 2s;
 }
The following table lists are  the transition properties:Property    Description
transition    A shorthand property for setting the four transition properties into a single property
transition-property    Specifies the name of the CSS property to which the transition is applied
transition-duration    Defines the length of time that a transition takes. Default 0
transition-timing-function    Describes how the speed during a transition will be calculated. Default "ease"
transition-delay    Defines when the transition will start. Default 0

 The two examples below sets all transition properties:
 Example:1
 Use all transition properties in one example:
 div
 {
 transition-property: width;
 transition-duration: 1s;
 transition-timing-function: linear;
 transition-delay: 2s;
 /* Firefox 4 */
 -moz-transition-property:width;
 -moz-transition-duration:1s;
 -moz-transition-timing-function:linear;
 -moz-transition-delay:2s;
 /* Safari and Chrome */
 -webkit-transition-property:width;
 -webkit-transition-duration:1s;
 -webkit-transition-timing-function:linear;
 -webkit-transition-delay:2s;
 /* Opera */
 -o-transition-property:width;
 -o-transition-duration:1s;
 -o-transition-timing-function:linear;
 -o-transition-delay:2s;
 }
 Example:2
 The same transition effects as above, using the shorthand transition property:
 div
 {
 transition: width 1s linear 2s;
 /* Firefox 4 */
 -moz-transition:width 1s linear 2s;
 /* Safari and Chrome */
 -webkit-transition:width 1s linear 2s;
 /* Opera */
 -o-transition:width 1s linear 2s;
 }