2020年7月11日-----5.4 CSS3过渡动画（transition@keyframs@animation）

CSS3

5.4 CSS3 过渡与动画（transition属性 @keyframs规则 animation属性）

过渡效果：transition 属性的主要作用是负责实现某个元素从一种初始状态向目标状态的转变过程，在此过程中将该元素的状态从一个形态转换为另一个形态。
动画效果：动画效果即借助 animation 属性来实现多个状态下形态的变化过程，在此过程中需遵循一系列的关键帧规则（@keyframes）并配合使用 animation 属性来达到预期效果。

过渡 transition属性

transition 属性的主要作用是实现元素状态转换的主要手段。
该机制将某属性或多个属性从一个固定值逐步过渡至另一个固定值。
在 transition 属性中包含了一些子特性（也可以将这些子特性整合至 transition 属性中进行描述）：
（1）transition-property 指定影响哪一个或多个特定的样式参数。
可以根据需要指定具体样式参数名称（单个参数）、多个参数（用逗号分隔）或全部样式参数（使用关键字 all）。
（2）transition-duration 表示转换过程所持续的时间长度。
时间单位可选用秒（s）或毫秒（ms）进行表示。
（3）transition-timing-function 用于描述转换过程中的插值方法。
该特性支持