CSS3

プロパティ

rotate

[Edge]⛌。→●、mdn

要素を回転する角度。

［translate、rotate、scale］プロパティは、ユーザー インタフェースにおける代表的な用法に対応する仕方で、作者が単純な変形を独立に指定できるようにする ― transform における［translate()、rotate()、scale()］の動作の順序を覚えずに済むよう。これらのプロパティは、それらの動作（同順）を transform とは独立に保って、スクリーン座標内で動作する。【すなわち、これらのプロパティによる変形は、決められた順序で適用される。】

rotate プロパティは、要素を回転する角度（<angle>）、および どの軸周りで回転するか（省略可能）を受容する。

none

<angle> ○

z 軸周りの回転角度。

[ x | y | z | <number>{3} ]? && <angle>

x

rotateX()関数と等価になる。

y

rotateY()関数と等価になる。

z

rotateZ()関数と等価になる。

開始<SPAN style="border:1px solid red;
 rotage:0 0 1 30deg;
">テスト</SPAN>終了

¶

<number>{3}

原点からのベクターの x、y、z を指す。

「<number>{3} <angle>」は、rotate3d() 関数と等価になる。

rotage:30deg

rotage:z 30deg

rotage:0 0 1 30deg

関連

rotate3d()。rotateX()、rotateY()、rotateZ()。

テスト