简述CSS3中 transition属性值及含义

CSS3中的transition属性是用来控制元素从一种样式渐变到另一种样式的时间及方式。它是一个简写属性，用来设置四个单独的过渡属性，包括 transition-property、transition-duration、transition-timing-function 和 transition-delay。

例如，下面的代码：

div {
  transition: background-color 2s ease-in-out 1s;
}

这里的各个值的含义如下：

• transition-property: 指定应用过渡效果的CSS属性名称。在上述例子中，这个属性是”background-color”。
• transition-duration: 指定过渡效果花费的时间。在上述例子中，这个时间是2秒。
• transition-timing-function: 指定过渡效果的时间曲线。在上述例子中，这个时间曲线是”ease-in-out”，表示过渡效果在开始和结束时速度慢，在中间速度快。
• transition-delay: 定义过渡效果开始前的延迟时间。在上述例子中，这个延迟时间是1秒。

如果你想为一个元素的多个属性添加过渡效果，你可以用逗号分隔每个属性，如下：

div {
  transition: background-color 2s, border-radius 1s;
}

在这个例子中，背景颜色的过渡时间是2秒，边框半径的过渡时间是1秒