css3过渡transition。

css3过渡是元素从一种样式逐渐改变为另一种的效果。

必须有两项内容：

1、规定您希望把效果添加到哪个css属性上

2、规定效果的时长

如果时长未规定，则不会有过渡效果，因为默认为0.

div
{
　　transition: width 2s;
　　-moz-transition: width 2s;	/* Firefox 4 */
　　-webkit-transition: width 2s;	/* Safari 和 Chrome */
　　-o-transition: width 2s;	/* Opera */
}
div:hover{
　　width:300px;
}
如果需要向多个样式添加过渡效果，请添加多个属性，由逗号隔开：

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;
}
div:hover{
　　width:300px;
　　height:300px;
　　transform:rotate(180reg);
　　-o-transform:rotate(180reg);
　　-webkit-transform:rotate(180reg);
　　-moz-transform:rotate(180reg);
}
以上两个例子，在鼠标放到元素上之后就会显示动画效果。

transition-timing-function:

linear|ease|ease-in|ease-out|ease-in-out|cubic-
bezier(n,n,n,n);//这表示动画的速度

;