transform-origin を .box:hover ではなく .box に指定するのはなぜですか?

.box:hover に書くと、ホバーしたときのみ左上を中心に回転するので、意図しない動作になります。
2022年1月26日
ユーザー

0:36

transform-origin プロパティは変形後にだけ指定したいというわけではないので…

とのことで.box:hover ではなく .box の方に記述していますが、なぜ、そちらに記述するのか意味が分かりません。

変形後の方に記述しても、回転はします。

.box:hover {
    /* transform: translate(50px, 20px); */
    transform: rotate(30deg);
    transform-origin: top left;

違いがよくわかりません。
宜しくお願い致します。

この回答を見るにはプレミアムプランへの登録が必要です

プレミアムプランとは?

このレッスンの質問と回答(2)