css：过渡transition 、转换transform、动画animation

CSS中的过渡（transition）、转换（transform）和动画（animation）是用于创建动态效果的不同特性。

1. 过渡（Transition）：

   过渡可以在样式改变时平滑地过渡到新样式。例如，当鼠标悬停时，颜色平滑过渡到新的颜色。

div {
  background-color: blue;
  transition: background-color 1s;
}
 
div:hover {
  background-color: red;
}

2. 转换（Transform）：

   转换可以应用平移、旋转、缩放和倾斜效果。

div {
  transform: rotate(0deg) scale(1);
  transition: transform 1s;
}
 
div:hover {
  transform: rotate(360deg) scale(2);
}

3. 动画（Animation）：

   动画可以创建更复杂的动态效果，并且可以控制每一帧。

@keyframes example {
  from {background-color: red;}
  to {background-color: yellow;}
}
 
div {
  animation-name: example;
  animation-duration: 4s;
  animation-iteration-count: infinite;
}

这些特性可以结合使用以创建更复杂和生动的界面效果。