transition与animation的区别

用法:

//animation
animation:move 1s linear infinite alternate;
animation:name duration timing-function delay iteration-count(规定动画应该播放的次数) direction(规定是否应该轮流反向播放动画)
@keyframes move{
}
//transition
transition:all 2s;
transition:property duration timing-function delay(定义过度效果何时开始);

区别:
(1)transition需要事件触发,所以不会再页面加载时自动触发
(2)transition是一次性的,不能重复发生,除非一再触发
(3)transition只能定义开始状态和结束状态,不能定义中间状态
(4)一条transition规则,只能定义一个属性的变化,不能涉及多个属性
animation弥补也以上的缺陷。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值