怎么讓☆圍繞中心旋轉？

Question

我正試圖讓這個明星圍繞它的中心旋轉。 現在它圍繞其他一些點旋轉。

 #question { font-size: 3em; animation: 1s linear 0s normal none infinite spin; display: block; width: 0; } @keyframes spin { from { transform: rotate(00deg); } to { transform: rotate(360deg); } } 

 <div id="testWrapper"><span id="question">☆</span></div> 

我怎樣才能解決這個問題，讓明星圍繞它的中心旋轉？

Answer 1

默認的transform-origin是50% 50% ，這是你想要的。

但是您將寬度設置為0，因此它在水平方向上繞0旋轉。

您需要使元素與內容一樣大，並使內容居中。

在您的示例中，只需將元素設置為inline-block並刪除width:0幾乎可以修復它。