ease: 开始和结束慢，中间快。相当于cubic-bezier(0.25,0.1,0.25,1) liner: 匀速。相当于cubic-bezier(0,0,1,1) ease-in: 开始慢。相当于cubic-bezier(0.42,0,1,1) ease-out: 结束慢。相当于cubic-bezier(0,0,0.58,1) ease-in-out: 和ease类似，但比ease幅度大。相当于cubic-bezier(0.42,0,0.58,1) step-start: 直接位于结束处。相当于steps(1,start) step-end: 位于开始处经过时间间隔后结束。相当于steps(1,end)

　　transition的多个属性值用逗号分隔开表示可以同时为多个值设置过渡属性。

transtion: <single-transition>[,<single-transition>]*

<single-transition>: <transition-property> || <transition-duration> || <transition-timing-function> || <transition-delay>

//property为all，timing-function为linear,delay为0s，duration为0s。表示无过渡行为 transition: 0s;

【1】若不同的transition-property的值，对应的transition-delay | transition-timing-function | transition-duration的属性值都相同时，其他的属性设置一个即可

#test1{ transition-property: width,background; transition-delay: 200ms; transition-timing-function: linear; transition-duration: 2s; } #test2{ transition: width 2s linear 200ms,background 2s linear 200ms; }

【2】当transition-property的值的个数多于对应的transition-delay | transition-timing-function | transition-duration的属性值(属性值的个数大于1个)时，将按顺序开始取值

#test1{ transition-property: width,background,opacity; transition-duration: 2s,500ms; transition-timing-function: linear,ease; transition-delay: 200ms,0s; } #test2{ transition: width 2s linear 200ms,background 500ms ease 0s,opacity 2s linear 200ms; }

【3】当transition-property的值少于对应的transition-delay | transition-timing-function | transition-duration的属性值时，多余的其他属性值将无效

#test1{ transition-property: width; transition-duration: 2s,500ms; transition-timing-function: linear,ease; transition-delay: 200ms,0s; } #test2{ transition: width 2s linear 200ms; }

【4】当transition-property的值中出现一个无效值，它依然按顺序对应transition的其他属性值（其他属性出现无效值，处理情况也类似）

#test1{ transition-property: width,wuxiao,background; transition-duration: 2s,500ms; transition-timing-function: linear,ease; transition-delay: 200ms,0s; } #test2{ transition: width 2s linear 200ms,background 2s linear 200ms; }

【5】当transition-property的值中，有些值重复出现多次，则以最后出现的值为准，前面所有出现的值都被认定为无效值，但依然按顺序对应transition的其他属性值