css过渡和动画

1，过渡特效transition
四个主要内容：过渡CSS属性名称、过渡执行时间、过渡时间速率曲线、过渡延时执行
①　过渡基础实现：（过渡一定要给时间）

②　过渡的四个属性：
A,transition-property执行变换的属性
Br,transition-dustion过渡执行的时间
C,transition-timing-function过渡时间曲线
D,transition-delay过渡延迟
组合值transition:(注意书写顺序，否则执行不了)

2,CSS动画animation
其可以让元素随着时间的推移，产生“位置”、“形状”、“颜色”、“大小”、“透明度”等属性变化。
注意：设置动画过程中
A,动画的基本实现：（名称和时间必须给）

B,动画的几个属性:
1,动画的名称animation-name
2,动画执行时间animation-duration
3,动画时间曲线animation-timing-function
4, 动画时间的延迟animation-delay
5,动画播放的次数animation-iteration-count
6,动画周期逆向播放animation-direction
7,动画的播放和暂停animation-play-state(running/paused)
8,设定元素动画形态animation-fill-mode
组合值写法animation:

上例中是一种将“animation”中所有支持的值都罗列的形式，在实际操作中，是可以根据需要“选取”所需要的值进行组合的