开发时候除了间接用img标签搁置图片外，也常常会用到在div中间接应用background-image的形式将图片作为背景图片搁置，通常会是这个样子：
.cover{ display: block; background-position: 50%; background-size: cover;}如果这时候须要做一个鼠标Hover下来时平滑放大一点，移开又平滑恢复原状的成果，就须要借助backgound-size来实现。
.cover:hover{ background-size: 110%;}同时还须要在原有款式中加上transition的设置
.cover{ ... transition: all .3s ease-in-out; background-size: cover;}然而这个时候发现尽管鼠标hover时背景图片曾经有放大成果，然而平滑适度动画并没有起成果，仍然是僵硬的变动，所以可能的起因是transition并不知道要怎么执行对应的CSS参数平滑适度。看了下Hover的前后差异，是background-size: cover变成了background-size: 110%，这个。。。仿佛它并不知道怎么进行线性变动呢，于是把原有CSS成果中的background-size改成100%试一下：
.cover{ transition: all .3s ease-in-out; background-size: 100%;}.cover:hover{ background-size: 110%;}试一下，Bingo！动画适度很天然，所以transition还是须要比拟明确的数值变动差别，才可能执行动画成果的