css3 2D變換
阿新 • • 發佈：2017-09-21
垂直 翻轉 cal css3 form 水平線 角度 寬度 bsp
css3中， 最常用的2D靜態變換有一下5種，他們都包含在transform方法中
* translate()
* rotate()
* scale()
* skew()
* matrix()
下面來逐一介紹
translate()方法
通過translate()方法，元素從當前位置發根據傳如入的2個參數（x坐標，y坐標）發生位移。
例如：transform(50px,100px) //元素向左偏移50px，向下偏移100px
rotate()方法
通過rotate()方法，元素順時針旋轉參數指定的角度，如果參數傳入是負值，元素將逆時針旋轉。
例如：transform:rotate(30deg); //元素順時針旋轉30度。
transform:rotate(30deg); //元素逆時針旋轉30度。
scale()方法
通過scale()方法，元素的尺度會增加或減少，根據參數傳入的寬度倍數和高度倍數發生變化。
例如： transform:scale(2,4); //元素寬度轉換成原來尺度的2倍，高度轉換為原來高度的4倍。
skew()方法
通過skew()方法，元素翻轉給定的角度，根據參數傳入的水平線（x軸）和垂直線（y軸）翻轉。
例如：transfrom:skew(30deg,20deg); //元素圍繞x軸吧元素翻轉30度，圍繞y軸翻轉20度。
matrix()方法
matrix()方法實質是將上面的旋轉，縮放，位移以及傾斜方法合在一個元素。其要求元素傳進6個參數。
css3 2D變換