动画效果——过度
过度动画:在不使用Flash或JavaScript的情况下,当元素从一种样式变成另一种样式时添加效果。
过度动画的属性:
1、transition 简写属性,用于在一个属性中设置四个过度属性。
2、transition-property 规定过渡应用的CSS属性的名称。
① none 没有属性会获得过度效果。
② all 所有属性都将获得过度效果。
③ 属性名称。
3、transition-duration 定义过度效果话费的时间。默认:0。单位:秒或毫秒。
4、transition-timing-function 规定过度效果的时间曲线。默认:ease。
① linear 规定以相同速度开始至结束的过度效果(等于cubicbezier(0,0,1,1))。
② ease 规定慢速开始然后变快,然后速度变慢的效果。(等于cubicbezier(0.25,0.1,0.25,1))
③ ease-in 规定以慢速开始的过度效果。(等于cubicbezier(0.42,0,1,1))
④ ease-out 规定以慢速结束的过度效果。(等于cubicbezier(0,0,0.58,1))
⑤ ease-in-out 规定以慢速开始和结束的过度效果。(等于cubicbezier(0.42,0,0.58,1))
⑥ cubic-bezier(n,n,n,n) 在cubic-bezier中定义自己的值。可能的值是0至1之间的数值。
transition-delay 规定过渡效果何时开始。默认:0。