旋转图像无法正常工作

我的示例/作品：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

回答