本机脚本旋转动画与无限迭代不起作用



我想通过无限迭代旋转标签,目前它在iOS设备上工作正常,但在Android上它只旋转2秒然后停止。

下面是我的CSS代码

.fas {
font-family: "Font Awesome 5 Free", "fa-solid-900";
font-weight: 900;
}
.spin {
animation-name: rotate;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
@keyframes rotate {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
<Label text="rotate value" class="fas spin"></Label>

我不确定这是否是一个错误,不能指望 {N} 与浏览器内联,因为我们在这里处理的是原生元素。下面的黑客似乎有效,

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

最新更新