Tansitions支持从一个属性值平滑过渡到另一个属性值
transition:property duation timing-function transition-delay
缺点是:只能指定属性的开始值和终点值,然后在这两个属性之间实现平滑过渡,不能实现更为复杂的动画效果
Animations支持通过关键帧的指定来在页面上产生更复杂的动画效果
div { animation-name: diagonal-slide; animation-duration: 5s; animation-iteration-count: 10; } @keyframes diagonal-slide { from { left: 0; top: 0; } to { left: 100px; top: 100px; } }