我试图让一个物体沿着弧线移动,为此我需要将 transform-origin
点设置为远离物体本身,然后 rotate
它.那么,与其盲目地移动 transform-origin
点,使用不同的长度,然后通过反复试验最终达到预期的结果,有没有办法让点可见,从而使过程更容易?
最佳答案
您可以使用 CSS 添加帮助程序。只需将以下代码片段添加到您将 transform-origin 属性设置为的元素中,其中 transform-origin 的 x 值与 helper 的 left 值相同,y 值与 top 值相同。
.foo {
position: relative;
transform-origin: 0 100%;
}
.foo::after {
position: absolute;
top: 100%;
left: 0;
width: 5px;
height: 5px;
content: '';
background-color: #f0f;
border-radius: 50%;
transform: translate(-50%, -50%);
}
关于css - 有什么方法可以在 CSS 中可视化变换原点?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41906994/