css3变形

这次依旧任性，依旧粗鲁的介绍变形，说一些基本的，我们最多用到的变形。也是看完后的一个笔记总结。

变形长这个样子：transform:

transform-origin: 这个是用来定义元素的中心位置，以后的一切关于变形的方式都是以这个中心为准则。当然也有关键字如top left right bottom，也可以用特定的值来定位。 (eg: transform-origin:left bottom -50px)

transform-style: flat(default) / preserve-3d 所有的变形是基于2D空间还是3D空间，默认情况下是基于2D空间下处理形式。

perspective: 设定查看者的位置，视觉pos，用户和元素3D空间Z平面的距离。两种使用方式：perspective()函数和perspective属性，函数用在变形元素本身上，属性用在变形舞台上，即变形元素的父元素上。

perspective-origin: 视觉的角度 关键字top left right bottom

backface-visibility: hidden | visible 很好理解 是否显示变形的背景，尤其在旋转的时候可以显现作用，或者制作一个立方体 透明或实体

translateX|Y|Z ：位移

scale：变形

rotate：旋转

skew：倾斜

标红的比较实用在h5中实现一些效果，其他的一些变形基本都很简单好理解