CSS3---2D変換

変身

Transition-origin: オブジェクト内の変換によって参照される原点を設定します

none: 変換なし

translate([,]): オブジェクトの 2D 変換 (2D 変換) を指定します。最初のパラメータは X 軸に対応し、2 番目のパラメータは Y 軸に対応します。 2 番目のパラメーターが指定されていない場合、デフォルトは 0 になります。

translateX(): オブジェクトの X 軸の平行移動を指定します

translateY(): オブジェクトのY軸の平行移動を指定します

rotate(): オブジェクトの 2D 回転 (2D 回転) を指定します。これには、既存の遷移元属性の定義が必要です

Scale([,]): オブジェクトの 2D スケール (2D スケーリング) を指定します。最初のパラメータは X 軸に対応し、2 番目のパラメータは Y 軸に対応します。 2 番目のパラメータが指定されていない場合は、デフォルトで最初のパラメータが使用されます。

ScaleX(): オブジェクトの X 軸の (水平) スケーリングを指定します

scaleY(): オブジェクトの Y 軸の (垂直) スケーリングを指定します

skew(): オブジェクトのスキュー変換(斜めの歪み)を指定します。最初のパラメータは X 軸に対応し、2 番目のパラメータは Y 軸に対応します。 2 番目のパラメーターが指定されていない場合、デフォルトは 0 になります。

skewX(): オブジェクトの Y 軸の (水平) 歪みを指定します

skewY(): オブジェクトのY軸の(水平)歪みを指定します

遷移:

transtion:[transtion-property]||[transtion-duration]||[transtion-timing-function]||[transtion-delivery]

transtion-property: オブジェクトのデフォルトの遷移に関連するプロパティを取得または設定します

transtion-duration: オブジェクトの遷移の継続時間を取得または設定します

Transtion-timing-function: オブジェクト遷移のアニメーションタイプを取得または設定します

Transtion-delivery: オブジェクト遅延遷移の時間を取得または設定します

アニメーション:

アニメーション:[アニメーション名]||[アニメーション期間]||[アニメーションタイミング関数]||[アニメーション遅延]||[アニメーション反復数]||[アニメーション方向]

animation-name: オブジェクトに適用されるアニメーション名を取得または設定します

animation-duration: オブジェクトアニメーションの継続時間を取得または設定します

animation-timing-function: オブジェクトアニメーションの遷移タイプを取得または設定します

animation-delivery: オブジェクトアニメーションの遅延時間を取得または設定します

animation-iteration-count: オブジェクトアニメーションのサイクル数を取得または設定します

animation-direction: オブジェクトアニメーションがループ内で逆に動くかどうかを取得または設定します