如何使用CSS减慢旋转动画？

Question

我有一个旋转关键帧来旋转这个世界图像：

@keyframes App-world-spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

由此调用：

.App-world {
    animation: App-world-spin infinite 20s linear;
    height: 200px;
}

产生这个：

我想放慢速度，以便产生一个更加真实的世界转速。

Answer 1

将20秒更改为200秒（秒），例如：

animation: App-world-spin infinite 200s linear;

200s告诉浏览器为元素设置动画200秒。所以它需要200秒才能完成一个完整的旋转。当然地球需要更长的时间，所以根据你的目的进行调整：）