1. div {
  2.   width: 200px;
  3.   height: 200px;
  4.   background-color: red;
  5.   /* transition: 要过渡的属性 花费时间 运动曲线 何时开始 */
  6.   transition: width 1s, height 1s;
  7.   /* transition: all 1s */
  8. }
  10. div:hover {
  11.   width: 500px;
  12.   height: 500px;
  13. }

运动曲线(可选)

属性值 描述
linear 匀速
ease 逐渐变慢(默认值)
ease-in 加速
ease-out 减速
ease-in-out 先加速后减速
steps() 间隔数量(步长)

花费时间(必选)

单位：s

何时开始（可选）

默认值：0s