1.
transform ：translate （50px 50px）水平垂直移动
transform ：rotate 绕z轴旋转
transform：scale 缩放
transform：skew 斜切
transform ： perspective （800px）rotateX（45deg） perspective ：透视距离
transform-style：perserve-3d 3D效果
不会影响文档流的
2.变形的中心点
div：nth-child（1）{
transform-origin：left conter；左中
transform-origin：left top；左上
transform-origin：（50，50）设置移动数字来确定他的旋转中心点
}
3.con 容器
backface-visibility：hidden 背面不可见
4.图片翻面
使用两张大小一样的图片，初始设置两张背面不可见，鼠标移动上照片上然后使用3D旋转效果进行转换。
5.
animation：moving 1s ease 1s 6 alternate； 设置移动 ifnidi
both设置起始值，从起始值移动。
@keyframes moving{
开始from{
width：100px；
}
结束to{
width：100px；
}
6.
人物走路动画
steps 帧动画
7. 多帧动画
@keyframes moving{
%0{
transfrom ：translateY（0px）；
}
%50{
transform ：translateY（200px）；
}
%100{
transform ：translateY（0px）；
}
