CSS transition属性有什么用

CSS transition属性用于控制元素的过渡效果，即在元素从一种状态过渡到另一种状态时，可以通过CSS属性来定义过渡的动画效果和时长。

具体来说，transition属性可以设置以下几个方面的内容：

1. 过渡属性（transition-property）：指定要过渡的CSS属性的名称，可以是单个属性或多个属性的组合。常见的过渡属性包括：color、background-color、opacity、width、height等。

2. 过渡时长（transition-duration）：指定过渡动画的持续时间，可以设置为秒（s）或毫秒（ms）。比如设置为1s表示过渡动画的持续时间为1秒。

3. 过渡延迟（transition-delay）：指定过渡动画的延迟时间，即从触发过渡到过渡动画开始执行之间的时间间隔。同样可以设置为秒（s）或毫秒（ms）。

4. 过渡函数（transition-timing-function）：指定过渡动画的时间函数，用于控制过渡过程中的动画速度变化。常见的过渡函数包括：ease、linear、ease-in、ease-out等。

通过设置这些过渡属性，可以实现元素在状态发生变化时，平滑地过渡到新状态的动画效果。比如可以设置鼠标悬停时，按钮的背景色从白色过渡到红色，或者设置一个元素的尺寸从小变大的动画效果等。