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,无延迟);

 

 
posted @ 2016-05-14 22:06  肖杨  阅读(334)  评论(0编辑  收藏  举报