旋轉圖像無法正常工作

我的示例/作品：http://thomasdebelder.be/1/ 我想旋轉一個月球，像這樣的行星：https://www.google.com/doodles/new-horizons-pluto-flyby但它不工作，我試着在我的css代碼中進行轉換：將它旋轉180度和360度，圍繞X旋轉，使用transform-origin：center，但仍然旋轉得很厲害。它需要圍繞中心旋轉，就像在谷歌鏈接中不是從左到右一樣。旋轉圖像無法正常工作

@keyframes moon { 100% { transform:rotate(180deg); }}

 <!-- MOON --> 
     <div class="moon"> 
     <img src="images/moon.png"> 
     </div>

2017-04-06 Distortion

谷歌正在使用GIF創建動畫，你可以在這裏看到它http:////www.google.com/logos/doodles/2015/new-horizons-pluto-flyby-5641113681526784.4-hp2x.gif –

您需要添加一個變換的起源：50％50％，使圍繞中心這個回合

2017-04-06 12:40:07 Sunkhern

不起作用，它保持不變。 – Distortion

回答