CSS3学习笔记-变形

translate() 移动元素 接受标准度量单位

translateX  | translateY | translateZ | translate3d

scale() 变大变小 接受一个十进制数

scaleX | scaleY | scaleZ | scale3d

rotate() 旋转 径向度量单位deg

rotateX | rotateY | rotate3d

skew() 倾斜元素 径向度量单位deg

skewX | skewY

matrix3d() 定义矩阵变形，基于X轴和Y轴坐标重新定义元素位置

perspective 指定一个透视投影矩阵。视距，用来设置用户和元素3d空间z平面之间的距离

transform

叠加效果用空格隔开，而不是,

.test{
  transform: translate(10px) scale(1.5) rotate(360deg);
}

transform-origin

设置变化的原点 一个值 x轴 两个值 x , y 三个值 x,y,z

值类型 ：基本类型，百分比，关键词top

transform-style 制定嵌套元素如何在空间中呈现

flat 2d平面呈现 | preserve-3d 3d空间呈现

CSS3学习笔记-变形

原文：https://www.cnblogs.com/goOtter/p/9686894.html