transition-duration
transition-duration 属性以秒或毫秒为单位规定过渡动画所需的时间。默认值为 0s ，表示不出现过渡动画。
语法
/* <time> 值 */ transition-duration: 3s; transition-duration: 60ms; transition-duration: 1s, 5s; transition-duration: 2s, 8s, 16ms; /* 全局值 */ transition-duration: inherit; transition-duration: initial; transition-duration: unset;
值
| 值 | 描述 |
|---|---|
| <time> | 过渡属性从旧的值转变到新的值所需要的时间。默认是 0s ，表示不会呈现过渡动画，属性会瞬间完成转变。不接受负值。 |
例子
HTML
<div class="stage"></div> <p>请把鼠标移动到红色色的 div 元素上，可以看到过渡效果。</p> <p><b>注释：</b>过渡效果会在开始前等待两秒钟。</p>
CSS
width:100px; height:100px; background:red; transition-property:width; transition-duration:5s;//过渡效果的持续时间。 transition-delay:2s;//过渡效果会在开始前等待两秒钟。
执行结果
请把鼠标移动到红色色的 div 元素上，可以看到过渡效果。
注释：过渡效果会在开始前等待两秒钟。