HTML/CSS-动画

过渡transition

过渡是元素变化时可以设置给元素属性变化时的切换状态

可以实现一些动画效果，提升用户体验

过渡属性：

transition：（合并）简写属性，内可以设置四种过渡属性；

transition-property:规定css变化的属性的名称；

transition-duration：定义过渡变化的花费时间；

transition-timing-function:过渡效果的时间曲线，默认：ease；（缓慢开始，加速，减速，完成变化）

transition-delay：过渡效果何时开始，默认：0；

合并简写
delay(从何时开时间,一般可以用于延时变化);
transition: width 1s linear 2s;
/*宽 1秒 线性(匀速) 延时两秒变化*/
分开写
transition-property: width;
transition-duration: 1s;
transition-timing-function: linear;
transition-delay: 2s;

css动画

要形成动画，先要定义动画，然后才能调用；

1.定义：

@keyframes 定义名称｛

from（动画开始，=0%）｛（定义变化的属性）｝

to（动画结束，=100%ÿ