定義和用法
變換屬性應用於一個2D或3D變換的元素。 此屬性允許你旋轉,縮放,移動,歪斜等元素。
瀏覽器支持
變換屬性在Internet Explorer 10和Firefox支持。
互聯網瀏覽器9支持一個替代方案中,msTransform屬性(2D transforms only) 。
歌劇,鉻和Safari支持替代,WebkitTransform屬性(3D和2D變換)。
句法
返回變換屬性:
object .style.transform
設置變換屬性:
object .style.transform="none| 屬性值 值 描述 none 定義應該是沒有改造 matrix( n,n,n,n,n,n ) 定義了一個2D變換,使用六個值的矩陣 matrix3d
( n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n ) 限定了3D變換,利用16個值的4×4矩陣 translate( x,y ) 定義一個2D轉換 translate3d( x,y,z ) 定義3D平移 translateX( x ) 定義了一個翻譯,僅使用值X軸 translateY( y ) 定義一個翻譯,只使用Y軸值 translateZ( z ) 定義了一個三維平移,僅使用值的Z軸 scale( x,y ) 定義一個2D縮放轉換 scale3d( x,y,z ) 定義一個3D縮放轉換 scaleX( x ) 通過給出一個值X軸限定了尺度變換 scaleY( y ) 通過給出對於Y軸的值限定了尺度變換 scaleZ( z ) 通過給出一個值的Z軸定義的三維尺度變換 rotate( angle ) 定義了一個二維旋轉,該角度在參數指定 rotate3d( x,y,z,angle ) 定義一個3D旋轉 rotateX( angle ) 限定沿所述X軸的3D旋轉 rotateY( angle ) 限定沿Y軸一3D旋轉 rotateZ( angle ) 限定沿Z軸在3D旋轉 skew( x-angle,y-angle ) 限定沿X軸和Y軸二維傾斜轉換 skewX( angle ) 限定沿所述X軸的二維傾斜轉換 skewY( angle ) 限定沿Y軸一2D歪斜變換 perspective( n ) 定義了一個透視圖,用於3D變換元件 initial 將此屬性設置為默認值。 閱讀關於初始 inherit 繼承其父元素此屬性。 閱讀關於繼承
技術細節
默認值: 沒有 返回值: 一個字符串,表示元素的變換屬性 CSS版本 CSS3
相關頁面
CSS參考: transform property
<Style對象