css - cssの視点の原点と変換の原点の違いは何ですか?

Question

私が理解しているように、それはおそらくそれがどのように見えるかが遠近法であり、実際にその空間でどのように動き回るかが起源です.

私は、視点の原点ではなく、変換の原点についてより明確にしています。

誰かが私にリンクや説明を教えてくれませんか?

Answer 1

視点は、要素の子のビュー角度を設定するために使用されます。
視点の原点は、要素を見ている空間内のポイントです

transformは、オブジェクト (要素) を回転/変換するために使用される単純な座標のものです。
transform originは、オブジェクトを平行移動/回転させるポイントを設定します。

たとえば、x 軸 (水平軸) を中心に 45 度で div を回転させたいとします。
あなたが使うtransform:rotateX(45deg);

div は回転しますが、遠近法なしで z 軸から見ているため、画面にはまだ長方形が表示されます。

しかし、パースペクティブを大きくすると、div の 3D ビューが表示されます。

あなたの目の中心はによって設定されperspective-originます。デフォルト値は50% 50%中心を意味します。x または y の値を増減すると、それに応じて「目」が移動します。

一方、変換の原点は、変換のポイントを設定します。たとえば、長方形をその中心以外の他の点を中心に回転させる必要がある場合は、transform-originプロパティを使用します