CSS3 Transition Animation

div{
width:200px;
height:300px;
background:red;
transtion:width 2s height 2s;
-webkit-transtion:width 2s height 2s;
-o-transtion:width 2s height 2s;
-moz-transtion:width 2s height 2s;
}
div:hover{
width:400px;
height:800px;
Background:orange;
}

Transtion: Attribute shorthand sets 4 transition properties.

Transtion-property: Specify transition CSS Property name

Transtion-duration: The time required for the transition to take. Default is 0

Transtion-timing-function: Specifies the transition time curve. Default is Ease

Transtion-delay: Specify transition effect Time

TRANSTION-TIMING-FUNCTION Specifies the transition effect time curve. Default is Ease

Linear: Linear transition

Ease: Smooth transitions

Ease-in: from slow to fast

Ease-out: from fast to slow

Ease-in-out: From slow to fast to slow

Cubic-bezier: Bezier Curve

CSS3 Transition Animation