之前的transform 可以实现转换，但是一下子就放大缩小视觉上不太好看，要想渐变该如何呢？可以使用transition
transition主要包含四个属性值：
transition: property duration timing-function delay;
执行变换的属性：transition-property；
变换延续的时间：transition- duration；
在延续时间段，变换的速率变化：transition-timing-function；
变换延迟时间：transition- delay；
其中~
transition-property 可取值：
none ：transition马上停止执行
all：任何属性变化都执行
其他常见的值：
1、color： 跟颜色有关系的，如：background-color，border-color，color；
2、length：跟数字有关系的，如：word-spacing，width，vertical- align，top，right，bottom，left，padding，margin；
3、transforms属性；
transition-timing-function 可取值：
ease：逐渐变慢
linear：匀速
ease-in：加速
ease-out：减速
ease-in-out：加速然后减速