欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

CSS3动画(transition和animation)

程序员文章站 2024-03-24 12:37:34
...

1>animation

	使用格式:
			
		关键帧

		@keyframes 动画名称{
		
			0%{

			}
			30%{

			}...
			100%{

			}

		}
	

animation-name	规定需要绑定到选择器的 keyframe 名称。
animation-duration	规定完成动画所花费的时间,以秒或毫秒计。
animation-timing-function	规定动画的速度曲线。
animation-delay	规定在动画开始之前的延迟。
animation-iteration-count	规定动画应该播放的次数。
animation-direction	规定是否应该轮流反向播放动画。


简写:
				参数顺序依次是:
	animation:名称 时间 速度曲线 延迟 次数 反向;

2>transition

transition:属性 时间 速度曲线 延迟

注意:
	transition:all(过渡所有)

***补充animation和transition区别

transition要有事件支持(点击,鼠标移入)
animation自动触发