css 过渡-transition 与 动画-animation 的区别

平时写 css 很少，对很多 css 知识点都是一知半解，遇到问题都是百度-复制-粘贴……-_-||

css 过渡-transition 与 动画 animation 一直都没搞清楚，这两天学习了一下，其实还是好区分的，只是一直都没用心学习一下……

具体怎么理解，见仁见智，以下仅是个人理解。

transition 类似于 总结了最常用的一类 animation；然后，进行了简化，以方便使用。任何 transition 效果，都可以用 animation 实现。

首先，触发机制。transition 是依赖于现有的各种机制，可参考之前的文章《点击触发 css transition 过渡动画-触发方式小结》。animation 的触发机制则较为原始，只要设置了 animation 属性，动画就会触发。

其次，动画复杂度。animation 可以添加任意多的关键帧，而 transition 只有开始和结束两个关键帧。毫无疑问，animation 的动画复杂度远优于 transition。

最后，使用的便捷性，自然是 transition 比较简单。