Xmind鸟瞰图:
简单文字总结:
过渡 transition: 过渡属性 过渡时间 运动曲线 何时开始
2D变形transform :
1.平移:translate(单位px)
2.缩放:scale(默认1,大于1放大,小于1缩小)
3.旋转:rotate(单位deg)
4.倾斜:skew(单位deg)
3D变形transform:
1.rotateX:沿着X轴旋转
2.rotateY:沿着Y轴旋转
3.rotateZ:沿着Z轴旋转
4.backface-visibility: hidden:背部不可见
5.transform-style: preserve-3d:保留子元素3d位置
6.perspective:视距(数值越大距离屏幕越近)
动画:
1.animation: 动画名称 动画时间 运动曲线 何时开始 播放次数 是否反方向;
2.运动曲线:ease(先快后慢) linear(匀速)
3.无限循环:infinite
4.规定动画:@keyframes 动画名称