CSS3 轉(zhuǎn)換:
?CSS3轉(zhuǎn)換,我們可以移動(dòng),比例化,反過(guò)來(lái),旋轉(zhuǎn),和拉伸元素。
2D轉(zhuǎn)換方法:
-
translate()方法:(位移) 根據(jù)左(X軸)和頂部(Y軸)位置給定的參數(shù),從當(dāng)前元素位置移動(dòng)。
? 例:translate(50px,100px)是從左邊元素移動(dòng)50個(gè)像素,并從頂部移動(dòng)100個(gè)像素。
-
rotate()方法:(旋轉(zhuǎn))在一個(gè)給定度數(shù)順時(shí)針旋轉(zhuǎn)的元素。負(fù)值是允許的,這樣是元素逆時(shí)針旋轉(zhuǎn)。
? 例:rotate(30deg)元素順時(shí)針旋轉(zhuǎn)30°
-
scale()方法:(縮放)該元素增加或減少的大小,取決于寬度(X軸)和高度(Y軸)的參數(shù)。
? 例:scale(2,4)轉(zhuǎn)變寬度為原來(lái)的大小的2倍,何其原始大小4倍的高度。
-
skew()方法:(扭曲)該元素會(huì)根據(jù)橫向(X軸)和垂直(Y軸)線參數(shù)給定角度。
? 例:skew(30deg,20deg)元素在x軸和y軸上傾斜20°和30°
-
matrix()方法:(矩陣)matrix方法有六個(gè)參數(shù),包含旋轉(zhuǎn),縮放,移動(dòng)和傾斜共功能。
? 例如:matrix(n,n,n,n,n,n)使用六個(gè)值的矩陣。
transform:適用于2D和3D轉(zhuǎn)換的元素。
transform-origin:允許更改轉(zhuǎn)化元素的位置。
3D轉(zhuǎn)換方法:
1.rotateX() 方法:圍繞其在一個(gè)給定度數(shù)X軸旋轉(zhuǎn)的元素。
2.rotateY()方法:圍繞其在一個(gè)給定度數(shù)Y軸旋轉(zhuǎn)的元素。
3.rotate3d(x,y,z.angle):定義3D轉(zhuǎn)換。
4.scale3d(x,y,z)方法:定義3D縮放轉(zhuǎn)換。




