css 旋转动画中心点 |登陆界面 bootcss动态背景

.rotate {
transform-origin: 50% 50%;    /* 默认值 */
}

如上所示，大家可以通过transform-origin属性来设置元素的旋转中心点。该属性接受两个值，分别代表X轴和Y轴的百分比。默认值为50% 50%。这意味着元素的旋转中心将会位于元素的中央位置。如果您希望将旋转中心点移动到任意位置，只需更改transform-origin属性的值即可。

.rotate {
transform-origin: top left;
}

如上所示，大家可以将transform-origin设置为“top left”。这将使元素的旋转中心点位于元素的左上角。这些值可以是其他CSS单位，例如像素或以“em”为单位的值，甚至可以是组合值“50% top”。只需确保您提供的值是有效的CSS位置属性，您的旋转中心就可以设置为任何您想要的位置。

通过正确使用transform-origin属性，您可以轻松控制元素的旋转中心，从而实现完美的旋转动画。