CSS3之过渡transition

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

要实现这一点，必须规定两项内容：
1、规定您希望把效果添加到哪个 CSS 属性上
2、规定效果的时长

举例：
应用于宽度属性的过渡效果，时长为 2 秒：
div { 
transition: width 2s;    如果有多个就用逗号间隔： width 2s, height 3s;
-moz-transition: width 2s; /* Firefox 4 */
-webkit-transition: width 2s; /* Safari 和 Chrome */
-o-transition: width 2s; /* Opera */
}
div:hover { width:300px; }          当鼠标指针悬浮于 <div> 元素上时，将会在2S内变化宽度，形成动画效果。

另外可以书写为：                 transition: width 2s, height 2s, transform 2s；    向宽度、高度和转换添加过渡效果
transition 简写属性，用于在一个属性中设置四个过渡属性。
①transition-property 规定应用过渡的 CSS 属性的名称。
②transition-duration 定义过渡效果花费的时间。默认是 0。
③transition-timing-function 规定过渡效果的时间曲线。默认是 "ease"（慢速开始，然后变快，然后慢速结束的过渡效果）。 还有linear  [ˈlɪniər] 匀速。
④transition-delay 规定过渡效果何时开始。默认是 0。