过渡动画、圆角、阴影、透明度

1.transition过渡
2.border-radius圆角

水平偏移　垂直偏移　羽化大小　扩展大小颜色

3.box-shadow阴影
4.rgba(前三个数值表示颜色,最后一个表示颜色的透明度(0-1))

变形

1.transform变换
2.translate(x,y)设置盒子位移
3.scale(x,y)设置盒子缩放
4.skew(x-angle,y-angle)设置盒子斜切
4.rotate(360deg)设置盒子旋转

设置平缓过渡效果transition:all 1s ease;

animation动画

1.@keyframes定义关键帧动画
2.animation-delay 动画延迟
3.alternate 原路返回
4.infinite无限次
5.animation-play-state:paused停止
6.animation-play-state:running开始
7.forwwards结束时抻开状态

1.transition : linear匀速

2.transition : ease开始和结束慢速

3.transition : ease-in开始时慢速

4.transition : ease-out结束时慢速

5.transition : steps动画步数