css3过渡 - 爱码网

css过渡
css过渡为一种状态到另外一种状态的变换

transition 过渡

transition 为一个简写属性，是一个transition-property （定义过渡的属性的名称）以及 transition-duration （定义过渡属性的所需动画的时间）和 transition-timing-function （描述中间值如何计算的）以及 transition-delay （描述过渡效果开始作用之前需要等待的时间）

transition-property

transition-property 定义过渡属性的名称
即指定引用过渡属性的名称

例如要对width属性应用过渡动画，则其该属性的值为width。规定的属性动画值有在这 https://developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_animated_properties 该列表列出来的属性为可动画的属性。

css3过渡

其css如下

div {
    width:300px;
    height:400px;
    background:#698771;
}
div:hover {
    background:#ededed;
    transition-property:background;
}

html 如下

原文链接