2Dトランスフォームの横（XY軸）回転

2Dトランスフォームの横（XY軸）回転について

要素をXY軸方法に回転させるには、transformプロパティのrotate関数を使用します。
引数には回転させる角度を指定、単位はdegを使用します。

回転する方向はX軸の右側を0度とし、時計回りに回転します。
負の値を指定することで反時計回りに回転します。

なお、transform-originプロパティによって回転の基点の位置（回転軸）が異なりますので、ご注意ください。
transform-originプロパティの詳細は 要素の基点（原点） を参照してください。

構文

							transform:rotate(角度);
						

サンプル

シミュレーション

rotate関数の値がどう反映されるかをシミュレートします。

IE8以下の対応

rotate関数はIE8以下に対応していません。
そこでfilterプロパティを使用することで再現できます。
ただし、指定できる角度は90度ずつしか指定できません。

構文

							filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=角度);
						

• ※ rotationの値は1から4の値が指定でき、0が0度、1が90度、3が180度、4が270度となります。
• ※ W3Cには準拠しません。