简述transform、translate、transition 分别是什么属性？CSS 中常 用的实现动画方式 ？

1. transform：这是一个CSS属性，它让我们可以旋转、缩放、倾斜或平移给定元素。这是一个复合属性，包括以下值：

• translate()：移动元素
• rotate()：旋转元素
• scale()：缩放元素
• skew()：倾斜元素

  例如，transform: translate(50px, 100px); 会将元素向右移动50px，向下移动100px。

1. translate：这是transform属性的一个函数值，用于移动元素。translate(x, y)会将元素沿着X轴移动x，沿着Y轴移动y。如果只提供一个参数，那么Y轴的偏移量默认为0。

2. transition：这是一个CSS属性，用于在一定的时间内平滑改变CSS属性的值。这是一个复合属性，包括以下子属性：

• transition-property：指定应用过渡效果的CSS属性
• transition-duration：指定过渡效果持续的时间
• transition-timing-function：指定过渡效果的时间曲线

• transition-delay：指定开始过渡之前的延迟时间

  例如，transition: background-color 2s; 会在2秒内平滑改变元素的背景色。

CSS中常用的实现动画方式主要有两种：一种是使用transition过渡效果，适用于开始和结束状态已知的简单动画；另一种是使用animation关键帧动画，可以创建复杂的动画序列，适用于需要精细控制动画过程的场景。