CSS3のrotateプロパティを使って、要素の角度を調整することができます。 これを応用して、アナログ時計を作ってみましょう。 サンプルを見る ※今回のサンプルは、CSS3の「transitionプロパティ」に対応した「Firefox」「Chrome」「Safari」でしか動作しません。 残念ながら現時点ではIEは「transitionプロパティ」には対応していません。 回転の中心点を指定する。 時計を作る前に、回転について理解しましょう。 物体の回転には、必ず中心点というものが存在します。 その中心点を設定するプロパティが、CSSの「transform-originプロパティ」です。 「transform-originプロパティ」は、要素の左上から、何％の位置に中心点を置くかを、X方向・Y方向それぞれ指定し、デフォルト値は「X:50% , Y:50%」です。 下記にいくつか例を示します
