transform

transform的含義是：改變，使…變形，轉換

 

在CSS3中transform主要包括如下幾種：旋轉rotate、扭曲skew、縮放scale 、 移動translate 、 矩陣變形matrix。

 

skewX(<angle>),skewY(<angle>)　　　　// <angle>　例如：30deg

cc的屬性包括：rotate() / skew() / scale() / translate(,)。

一、transform:rotate()：

案例代碼如：

.demo_transform1{-webkit-transform:rotate(10deg);-moz-transform:rotate(10deg)}

二、transform:skew();

案例代碼如：

.demo_transform2{-webkit-transform:skew(20deg);-moz-transform:skew(20deg)}

三、transform:scale();

*若是要放大2倍，須寫成"2.0";若是縮小就"-2.0";

案例代碼如：

.demo_transform3{-webkit-transform:scale(1.5);-moz-transform:scale(1.5)}

四、transform:translate()：

案例代碼如：

.demo_transform4{-webkit-transform:translate(120px,0);-moz-transform:translate(120px,0)}