是否可能与当前CSS3来翻译对象(特别是DIV)沿弧或曲线？这里有一个图片来帮助说明。
解决方法
您可以使用嵌套元素，因此包装器和内部元素将旋转到相反的角度，以便内部元素的旋转将补偿包装器的旋转。
使用它，您可以创建具有不同曲线路径的“翻译”。
这里是一个Dabblet.堆栈片段：
/* Arc movement */
.wrapper {
width: 500px;
margin: 300px 0 0;
transition: all 1s;
transform-origin: 50% 50%;
}
.inner {
display: inline-block;
padding: 1em;
transition: transform 1s;
background: lime;
}
html:hover .wrapper {
transform: rotate(180deg);
}
html:hover .inner {
transform: rotate(-180deg);
}
<div class="wrapper">
<div class="inner">Hover me</div>
</div>
此外，Lea Verou写了一篇关于这个问题的文章，只使用一个元素：http://lea.verou.me/2012/02/moving-an-element-along-a-circle/
