定義と使用法
transformプロパティは、要素の2Dまたは3D変換を適用します。 このプロパティは、あなたが回転することを可能にする、スケール、移動、スキューなど、要素。
ブラウザのサポート
transformプロパティは、Internet Explorer 10およびFirefoxでサポートされています。
Internet Explorer 9の代替をサポートし、msTransformプロパティ(2D transforms only) 。
オペラ、ChromeとSafariは、代替、WebkitTransform性(3Dおよび2D変換)をサポートします。
構文
transformプロパティを返します:
object .style.transform
transformプロパティを設定します。
object .style.transform="none| プロパティ値 値 説明 none 何の転換があってはならないことを定義 matrix( n,n,n,n,n,n ) 6つの値のマトリックスを使用して、2D変換を定義 matrix3d
( n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n ) 16の値の4×4行列を使用して、3D変換を定義 translate( x,y ) 2D変換を定義します translate3d( x,y,z ) 3D変換を定義します translateX( x ) X軸の値のみを使用して、翻訳を定義します translateY( y ) Y軸の値のみを使用して、翻訳を定義します translateZ( z ) Z軸の値のみを使用して、3D変換を定義します scale( x,y ) 2Dスケール変換を定義します scale3d( x,y,z ) 3Dスケール変換を定義します scaleX( x ) X軸の値を与えることによって、スケール変換を定義します scaleY( y ) Y軸の値を与えることによって、スケール変換を定義します scaleZ( z ) Z軸の値を与えることによって、3Dスケール変換を定義します rotate( angle ) 2D回転を定義し、角度は、パラメータで指定されています 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軸に沿って2Dスキュー変換を定義 skewX( angle ) X軸に沿った2Dスキュー変換を定義 skewY( angle ) Y軸に沿った2Dスキュー変換を定義 perspective( n ) 3D変換要素の斜視図を定義します initial このプロパティがデフォルト値に設定します。 最初の記事を読みます inherit その親要素からこのプロパティを継承します。 継承についての記事を読みます
技術的な詳細
デフォルト値: なし 戻り値: 要素のtransformプロパティを表す文字列、 CSSのバージョン CSS3
関連ページ
CSSリファレンス: transform property
<スタイルオブジェクト