2D,3D图形转换所用知识点-原创手记-慕课网

在文档中建立桥套的 section>section>section 按tab
transform：改变、变化、转变父元素发生变换时，子元素会随着变化

1. scale：缩放；（x,y）;   (0.6)表示宽高都缩放0.6倍 小数的话，表示缩小 大于1的表示变大 若写一个值  默认另一个为1；
2.  translate：平移 (x,y)  transform: translate(100px,50px)           
3. skew,切变，倾斜，deg;角度；  transform: skew(5deg,0deg)   第一个值是向x轴的倾斜角度，（水平左上角向左动）第二个只是向y轴；（沿y轴向上移动）；
4. rotate：旋转;默认是绕中心点旋转;  顺时针为正，逆时针为负*
5. 组合变换  ： transform: rotate(45deg) scale(0.6)

  origin：起点，原点；变换的参考点，默认值是50% 50% 取值用百分比；

1.   transform-origin:100% 100%

transform 向元素应用 2D 或 3D 转换。
transform-origin 允许你改变被转换元素的位置。
transform-style 规定被嵌套元素如何在 3D 空间中显示。
perspective 规定 3D 元素的透视效果。
perspective-origin 规定 3D 元素的底部位置。
backface-visibility 定义元素在不面对屏幕时是否可见。
2D

* translate  (平移 )
* rotate(旋转)
* scale(缩放)
* skew(切变，主要使图片变形)
* matrix(矩阵，复杂变换，包括实现以上几个标签的效果。)