本文主要是介绍transform-origin设置变形中心点，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
HTML代码：
<div class="box"></div>
CSS代码：
.box {width: 100px;height: 100px;background-color: purple;margin-left: 150px;transition: all .5s;/*transform-origin: center; 默认盒子的正中心为旋转中心点*//*transform-origin: left; 设置左边线中心点为旋转中心点*//*transform-origin: left top; 设置左上角为旋转中心点*/transform-origin: 10px 30px; /* 设置距离左边线10px，上边线30px交叉点为旋转中心点*/
}
.box:hover {transform: rotate(180deg);
}
实现效果：
这篇关于transform-origin设置变形中心点的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
