我正在为模拟创建一个重置按钮，作为Web应用程序的一部分。当你点击按钮时，它会旋转重置图标。为此，我使用Transform Rotate来旋转文本元素，但当我旋转它时，它最终比开始时更低。我不知道为什么会发生这种情况，但谷歌的答案让我一事无成。任何帮助都很感激，谢谢。

关键帧：

@keyframes spin360 { 
    0% {
        transform: rotate(0deg); 
    }
    100% { 
        transform: rotate(-360deg); 

    } 
}

我使用以下函数调用JavaScript中的关键帧：

<代码>函数spin（）{document.getElementById（"；ResetButtonSVG"；）。style.animation="；spin360 0.5S轻松向前"；}

*请注意，它被称为ResetButtonSVG，因为我计划使用SVG，但我最终使用了Unicode.

顺晟科技：

只需将您的HTML更改为如下

<代码><；按钮onclick="；旋转（）"；>；<；？XML版本="；1.0"；编码="；ISO-8859-1"；？>；<；SVG版本="；1.1"；ID="；ResetButtonSVG"；xmlns=http：//www.w3.org/2000/svg“ xmlns：XLink=http：//www.w3.org/1999/xlink” X=0pxY="；0px"；viewbox="；00179.019179.019"；style="；enable-background：new 00179.019179.019；"；XML：space="；保留"；>；<；G>；<；G>；<；路径样式="；填充：#010002；"；D="；M138.121，138.357C-13.02，13.008-30.312，20.174-48.714，20.174C-37.955，0-68.84-30.867-68.876-68.81L14.046，14.064C0.931，0.925，2.429，0.925，3.359，0C0.919-0.931，0C-0.931，0.925-0.931，2.429，0，3.359C0.459，0.465，1.068，O.692，1.671，O.692C0C1.235，39.531，33.689，71.328，73.512，71.328C19.673，0，38.164-7.661，52.079-21.57C0.925-0.925-2.429，0-3.353C140.562，137.426，139.052，137.426，138.121，138.357Z"/>；<；路径样式="；填充：#010002；"；D="；M178.32，75.234C-0.919-0.925-2.423-0.925-3.353，0L163.152，87.06C-1.247-39.531-33.701-71.322-73.518-71.322C-19.685，0-38.17，7.661-52.085，21.57C-0.931，0.925-0.931，2.429，0，3.353C0.919，0.931，2.429，0.931，3.353，0C13.014-13.008，30.312-20.174，48.714-20.174C37.949，0，68.84，30.861，68.888，68C-0.925-0.925-2.429-0.525-3.359，0C-0。919，0。931-0C179.251，77.668，179.251，76.164，178.32，75.234Z"/>；<；/G>；<；/G>；<；/SVG>；<；/按钮>；

并将此CSS应用于按钮和SVG

<代码>按钮{显示：Flex；align-items：居中；填充：10px；}SVG{宽度：25px；高度：25px；}