前面介紹了基本的變形方式（旋轉，移動，縮放，傾斜）。現在來介紹和這些變形方式相關聯的屬性。
transform-origin
每個元素都有乙個形變中心點。元素的旋轉縮放等形邊都是基於形變中心點變化的。形變中心點的座標是以元素的左上角為座標原點的。
上圖backface-visibility
backface-visibility此屬性定義元素旋轉到背面是否可見。
預設值為visible，表示可見
hidden表示不可見
perspective
此屬性定義3d視距。
我們到平面圖形上的點的視距都相同，所以才會是平面效果。而立體效果就是因為不同視距產生的，俗稱近大原小。
perspective的值預設為none，沒有視距，所有點的視距相同，所以即使繞x軸旋轉的元素，看起來只是變窄，而沒有3d效果。定義了perspective後，旋轉的元素上的點就會有不同的視距，近大遠小的效果就會產生。
當perspective的值越大時，視距的差別就越不明顯。如10000001，10000002也可以認為視距相同。當perspective的值越小時，視距的差別就顯得越大。一般500px值也就合適了，還是要看元素視距的差值。
注意：此屬性必須定義在父元素上才會有效果。
transform: perspective(100px) rotatex(30deg)
這種寫法指定其父元素的視距，不過視距只針對當前元素。而且必須必須寫在變形方式的前面。
直接在父元素上定義perspective: 100px，會使所有子元素共享3d視距
perspective-origin
定義觀察點的位置。預設為中心
transform-style
transform-style屬性確定元素的子元素是否位於3d空間中，還是在該元素所在的平面內被扁平化。
預設值為flat，子元素在2d平面上。preverse-3d表示子元素在3d空間內。
當元素旋轉時，它的參考座標會跟著旋轉
CSS3中的變形處理 transform 屬性
在css3中，可以利用transform功能來實現文字或影象的旋轉 扭曲 縮放 位移 矩陣 原點 這六種型別的變形處理，下面將詳細講解transform的使用。變形 旋轉 rotate div.box 順時針旋轉45度 變形 扭曲 skew div.box 通過skew 函式將長方形變成平行四邊形。...
css3 變形處理 transform
在css3中可以利用transform功能來實現文字影象的旋轉 縮放 傾斜 移動這四種型別的變形處理 相容性 瀏覽器safari chrome 8 firefox 4 opera 10 各個瀏覽器寫法 示例文字div css div解析 rotate 45deg 含義 rotate是旋轉，45deg...
CSS3變形屬性 transform
形狀變換屬性 transform 可以實現元素的形狀 角度 位置等的變化。值 rotate 以x y z為軸進行旋轉，預設為z rotatex rotatey rotatez rotate3d x,y,z,angle rotate3d x,y,z,angle 為三個方向的向量和方向 例 transf...