transition语法
| 属性名 | 属性描述 |
|---|---|
| transition-duration | transition效果需要指定多少秒或者毫秒才能完成 |
| transition-property | 指定CSS属性的name,transition效果 |
| transition-timing-function | 指定transition效果的转速曲线 |
| transition-delay | 定义transition效果开始的时候 |
语法：
transition：<single-transition>[, <single-transtion>]*
<single-transition> = [none | <single-transition-property>] || <time> || <transiton-timing-function> ||<time>
写法举例
transition-property: width;
transtion-duration: 1s;
transtion-delay: 1s;
transtion-timing-function: ease-in-out;
简写:
transition: width 1s 1s ease-in-out;
transition-timing-function值
| 值 | 描述 | 速度 |
|---|---|---|
| linear(默认属性) | 规定以相同速度开始至结束的过渡效果（等于 cubic-bezier(0,0,1,1)）。 | 匀速 |
| ease | 规定慢速开始，然后变快，然后慢速结束的过渡效果（cubic-bezier(0.25,0.1,0.25,1)）。 | 快-慢-慢 |
| ease-in | 规定以慢速开始的过渡效果（等于 cubic-bezier(0.42,0,1,1)）。 | 快-快 |
| ease-out | 规定以慢速结束的过渡效果（等于 cubic-bezier(0,0,0.58,1)）。 | 慢-慢 |
| ease-in-out | 规定以慢速开始和结束的过渡效果（等于 cubic-bezier(0.42,0,0.58,1)）。 | 慢-快-慢 |
| cubic-bezier(n,n,n,n) | 在 cubic-bezier 函数中定义自己的值。可能的值是 0 至 1 之间的数值。 | 自定义 |
