前端中transition的用法

transition是一种CSS属性，用于在CSS属性值发生变化时创建动画效果。它可以应用于元素的任何属性，如颜色、位置、大小、透明度等。

transition的语法如下：

transition: property duration timing-function delay;

其中，property指定要应用transition的CSS属性，duration指定动画的持续时间，timing-function指定动画的速度曲线，delay指定动画延迟多少时间开始执行。

例如，将一个按钮的背景颜色在鼠标悬停时从白色变为黑色，并且添加一个0.5秒的动画效果，可以这样写：

button {
  background-color: white;
  transition: background-color 0.5s ease;
}

button:hover {
  background-color: black;
}

这样，在鼠标悬停时，按钮的背景颜色会平滑地从白色变为黑色，持续时间为0.5秒，速度曲线为ease（即先慢后快再慢）。