在 CSS 中，我们可以使用 transition 属性来控制元素的动画过渡效果。具体来说，我们可以通过指定元素属性的起始值和目标值，来实现属性值的平滑过渡。
例如，我们可以使用以下代码来控制一个元素的背景色在鼠标悬浮时从白色渐变为黑色：
.my-element {
background-color: white;
transition: background-color 0.5s ease;
}
.my-element:hover {
background-color: black;
}
在上述代码中，我们首先定义了一个名为 .my-element 的元素，并将其背景色设置为白色。接着，我们使用 transition 属性指定了一个背景色变化的过渡动画，并设置了动画时间为 0.5 秒，动画速度为 ease（即缓慢开始，缓慢结束）。最后，在 .my-element:hover 选择器中，我们将元素的背景色设置为黑色，从而触发动画效果。
除了背景色，我们还可以使用 transition 属性来控制元素的其他属性，例如宽度、高度、位置等。具体来说，我们可以在 transition 属性中指定多个属性，并使用逗号分隔它们。
例如，以下代码将会在鼠标悬浮时同时控制一个元素的宽度和高度变化：
.my-element {
width: 100px;
height: 100px;
background-color: white;
transition: width 0.5s ease, height 0.5s ease;
}
.my-element:hover {
width: 200px;
height: 200px;
}
在上述代码中，我们首先定义了一个名为 .my-element 的元素，并将其宽度和高度都设置为 100 像素。接着，我们使用 transition 属性指定了宽度和高度变化的过渡动画，时间和速度都设置为了 0.5 秒和 ease。最后，在 .my-element:hover 选择器中，我们将元素的宽度和高度都设置为 200 像素，从而触发动画效果。