CSS 过渡(transition)
CSS 过渡(transition), 是css3中, 用来控制 CSS 属性的变化速率。可以让属性的变化持续一段时间,而不是立即生效。
Transition-Property:
要变化的属性值,只有被指定的属性才会在过度时产生动画效果。
#demo {
width:20px;
height:20px;
background-color:#0080FF;
transition:width 1.5s; /*只会对width的改变产生动画效果*/
}
transition-property:width , height;/*写多个值用逗号分割*/
transition-duration:2.5s;/*过渡持续时间可以只写一个,也可分别指定,同样用逗号分割*/
Transition-duration:
设定过渡持续的时间,可以为秒或毫秒。
Transition-timing-function:
设定过渡动画的曲线,默认不设置时,为ease,慢速开始,然后变快再慢速;
transition-timing-function: ease-out;
Transition-delay:
设定动画开始前的等待时间(默认为0,无延迟);