transform 2d 3d使用

1. transform: translate(300px,200px);位移

  transform:  css3变换（位移、缩放、转动、拉长或拉伸） translate()  2d平移

  给一个像素值 就代表 x轴偏移 y默认为0  支持正负值

2. transform:rotate(n deg) 旋转    单位：角度（度数） deg 支持正负值

   rolateX/Y/Z 配合perspective 开启3D模式  perspective 设置在body上（perspective=500;）

3. transform: scale(X ,Y);扩大 缩放        一个值为x y轴同时变化

4. transform: skew(45deg) 斜切

5.transform-origin: 20px 40px; 可以改变轴心点

想用效果更明显可以用一个过渡：transition: property duration timing-function delay;

transition-property 指定CSS属性的name，transition效果

transition-duration transition效果需要指定多少秒或毫秒才能完成

transition-timing-function 指定transition效果的转速曲线

transition-delay   定义transition