CSSのtransform-origin属性の使い方

#定義と使用法

transform-origin 属性を使用すると、変換される要素の位置を変更できます。

2D 変換要素は、要素の x 軸と y 軸を変更できます。 3D 変換要素の Z 軸も変更できます。

注: この属性は、transform 属性と一緒に使用する必要があります。

例

回転要素の基点の位置を設定します:

div
{
transform: rotate(45deg);
transform-origin:20% 40%;

-ms-transform: rotate(45deg); 		/* IE 9 */
-ms-transform-origin:20% 40%; 		/* IE 9 */

-webkit-transform: rotate(45deg);	/* Safari 和 Chrome */
-webkit-transform-origin:20% 40%;	/* Safari 和 Chrome */

-moz-transform: rotate(45deg);		/* Firefox */
-moz-transform-origin:20% 40%;		/* Firefox */

-o-transform: rotate(45deg);		/* Opera */
-o-transform-origin:20% 40%;		/* Opera */
}

構文

transform-origin: x-axis y-axis z-axis;

以上がCSSのtransform-origin属性の使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。