svg - 使现有的SVG旋转(正在加载图标)

Question

我有一个svg图标，我想使其旋转(加载)。这可能吗？我找到了可以创建旋转图标的在线站点，但没有找到可以使现有svg图标旋转的转换器。

Answer 1

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% {  transform: rotate(359deg); }
}
#star {
    animation: spin 2s linear infinite;

}

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg id=star width="4cm" height="4cm" viewBox="0 0 700 400" xmlns="http://www.w3.org/2000/svg" version="1.1">
  <polygon fill="red" stroke="red" stroke-width="10" 
            points="350,75  379,161 469,161 397,215
                    423,301 350,250 277,301 303,215
                    231,161 321,161" />
  
</svg>