屬性如下
matrix()：2d矩陣
translate()：平移，第乙個引數為x軸，第二個引數為y軸，第二個引數預設為0
translatex()：x軸（水平方向）的平移
translatey()：y軸（垂直方向）的平移
rotate()：2d旋轉
scale()：2d伸縮。第乙個引數對應x軸，第二個引數對應y軸。第二個引數預設與第乙個引數的值一樣。伸縮的是此元素的變化座標軸的刻度，不改變元素本身大小，伸縮後，伸縮軸會一直影響後面元素。
scalex()：x軸的縮放
scaley()：y軸的縮放
skew()：傾斜座標軸，也拉伸了座標軸，x有值傾斜y軸
skewx()：x軸的傾斜,正值往逆時針方向傾斜
skewy()：y軸的傾斜，正值往順時針方向
matrix3d()：以乙個4x4矩陣的形式指定乙個3d變換
translate3d()：3d位移。第1個引數對應x軸，第2個引數對應y軸，第3個引數對應z軸，引數不允許省略
translatez()：z軸的平移
rotate3d()：指定物件的3d旋轉角度，其中前3個引數分別表示旋轉的方向x,y,z，第4個引數表示旋轉的角度，x，y，z的比值作為乙個向量方向軸
rotatex()：在x軸上的旋轉角度
rotatey()：在y軸上的旋轉角度
rotatez()：在z軸上的旋轉角度
scale3d()：指定物件的3d縮放。第1個引數對應x軸，第2個引數對應y軸，第3個引數對應z軸，引數不允許省略
scalez()：z軸縮放
perspective()：透視距離，景深，需要給父級設定
這是座標軸,箭頭代表角度為正值時的轉動方向
看起來像是變大了，其實它本身的大小並沒有變，只是它的座標軸變了，就導致現在的400px才能表示原來的200px。如果移動它的位置就可以看出來
加上transform:translatez(300px);
看起來變大了，是因為它離我們的眼睛更近了。它的原理是投影，我們的視線看向影象的四周，然後投影到最開始的那個平面上就是我們看到的大小。
css3中的變形（transform）
transform 字面上的意思就是 使改變外觀 改變形態 在css3中transform主要包括以下幾種 1.旋轉 rotate 2.傾斜 skew 3.縮放 scale 4.移動 translate 語法transform none transform rotate skew scale tra...
css3中的transform方法
transform屬性應用於元素的2d或3d轉換。這個屬性允許你將元素旋轉，縮放，移動，傾斜等。translate transform的乙個方法 通過 translate 方法，元素從其當前位置移動，根據給定的 left x 座標 和 top y 座標 位置引數 用法transform transl...
css3的transform中scale縮放詳解
下面我們從3個方面開始介紹 1 scale x,y 對元素進行縮放 x表示水平方向縮放的倍數 y表示垂直方向的縮放倍數 y是乙個可選引數，沒有設定的話，則表示x，y兩個方向的縮放倍數是一樣的。並以x為準。transform scale 2,2.5 2 scalex 元素只在x軸 水平方向 縮放元素。...