一.
transform是改變的意思，在css中主要包括旋轉，移動，縮放，扭曲，矩陣變形。
二.
旋轉rotate
rotate(<angle>) ：通過指定的角度參數對原元素指定一個2D 旋轉，需先有transform-origin屬性的定義。transform-origin定義的是旋轉的基點，其中angle是指旋轉角度，如果設置的值為正數表示順時針旋轉，如果設置的值為負數，則表示逆時針旋轉。如：transform:rotate(30deg):
三.
移動translate
移動translate我們分為三種情況：translate(x,y)水平方向和垂直方向同時移動（也就是X軸和Y軸同時移動）；translateX(x)僅水平方向移動（X軸移動）；translateY(Y)僅垂直方向移動（Y軸移動）
（1）translate(x,y)
transform:translate(100px,20px):向左移動100px,向下移動20px.
（2）translateX（）
只向x軸進行移動元素，基點是元素中心點，如：transform:translateX(100px):向左平移100px。
（3）translateY()
只向Y軸進行移動，transform:translateY(20px):向右平移20px
四.縮放scale
縮放scale和移動translate是極其相似，scale(x,y)使元素水平方向和垂直方向同時縮放（也就是X軸和Y軸同時縮放）；scaleX(x)元素僅水平方向縮放（X軸縮放）；scaleY(y)元素僅垂直方向縮放（Y軸縮放），但它們具有相同的縮放中心點和基數，其中心點就是元素的中心位置，縮放基數為1，如果其值大於1元素就放大，反之其值小於1，元素縮小。
(1)scale(x,y)使元素水平方向和垂直方向同時縮放
其中X表示水平方向縮放的倍數，Y表示垂直方向的縮放倍數
（2）scaleX() 水平縮放
scaleX表示元素只在X軸(水平方向)縮放元素，他的默認值是(1,1)
（3）scaleY() 垂直縮放
scaleY表示元素只在Y軸（垂直方向）縮放元素，其基點同樣是在元素中心位置，可以通過transform-origin來改變元素的基點。