CSS transition属性，动画过渡效果
transition属性
CSS中的transition属性，可以用于设置HTML元素的过渡效果，也是一种过渡的简写的形式，比如下方的示例，鼠标悬停之时，将在宽度进行过渡效果：
语法
transition: property duration timing-function delay
属性值
| 属性值 | 描述 |
|---|---|
| transition-property | 指定用于过渡效果的CSS属性名，比如width、height、background-color等等； |
| transition-duration | 指定过渡时间，单位为秒或毫秒； |
| transition-timing-function | 指定过渡效果的速度曲线； |
| transition-delay | 指定过渡效果何时进行； |
transition属性实例代码，及在线编辑器
下方实例中，鼠标悬停时，背景颜色将发生改变，并且过渡时间为2s：
<div id='d2'></div>
<style>
#d2{width:50%;height:50%;background-color:skyblue;transition:background-color 2s;}
#d2:hover{background-color:blue;}
</style>