过度：transition
在规定时间内，把元素从元素1过度到元素2，展现出来
CSS属性：在一定时间内，从一个字变化到另一个值。
书写代码：
transition-property：属性 ；
transition-duration：过度时间；（秒s、毫秒ms）
缺点：
1，可能会改变布局。
2，只能从状态1到状态2
过度类型：文本、颜色（背景）、尺寸、透明度。
设置渐变函数：
transition-timing-function：linear；线性渐变
transition-timing-function：ease；平滑过渡
transition-timing-function：ease-in；由慢到快
transition-timing-function：ease-out；由快到慢
transition-timing-function：ease-in-out；由慢到快再到慢
设置过度延迟时间：
transition-delay：时间（秒s、毫秒ms）；
动画：animation
动画步骤：
创建一个动画；
格式：@keyframes 自定义名称
例：@keyframes F65设置动画时间内样式;
0%{
…………………………
}
20%{
…………………………
}
60%{
…………………………
}
，
，
，
，
100%{
…………………………
}
标注*： 20%为总时间的百分比时间，
大括号{ }内为这个时间段内要变化的样式代码使用动画；
动画名称：
animation-name：动画名称；（如F65）
动画的时间：
animation-duration：时间；（秒s、毫秒ma）
动画的函数：
animation-timing-function：linear；线性
动画的次数：
animation-iteration-count：循环次数；（无限次数：infinite）
变形：transform
缩放：
transform：scale（）；（缩小：0-1、放大：1-max）
旋转：
transform：rotate（ 度数deg）；（正值顺时针，负值逆时针）
rotate（默认值：沿z轴旋转）
rotatex（沿x轴旋转）
rotatey（沿y轴旋转）
倾斜：
transform:skew（度数deg）
偏移量：
transform：translate（x，y）；正值向右负值向左，正值向下负值向上
多值添加（缩写）：
transform：变形方式（变形值）空格键变形方式（变形值）