Animation CSS旋转动画仅在Webkit中工作
我想让一个元素无限旋转360度。这是我的密码:Animation CSS旋转动画仅在Webkit中工作,animation,css,Animation,Css,我想让一个元素无限旋转360度。这是我的密码: .rotate-animation { -webkit-animation: rotate 2s linear 0 infinite normal; -moz-animation: rotate 2s linear 0 infinite normal; -o-animation: rotate 2s linear 0 infinite normal; -ms-animation: rotate 2s linear 0 infinit
.rotate-animation {
-webkit-animation: rotate 2s linear 0 infinite normal;
-moz-animation: rotate 2s linear 0 infinite normal;
-o-animation: rotate 2s linear 0 infinite normal;
-ms-animation: rotate 2s linear 0 infinite normal;
animation: rotate 2s linear 0 infinite normal;
}
@-webkit-keyframes rotate {
from {
-webkit-transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
}
}
@-moz-keyframes rotate {
from {
-moz-transform: rotate(0deg);
}
to {
-moz-transform: rotate(360deg);
}
}
@-o-keyframes rotate {
from {
-o-transform: rotate(0deg);
}
to {
-o-transform: rotate(360deg);
}
}
@-ms-keyframes rotate {
from {
-ms-transform: rotate(0deg);
}
to {
-ms-transform: rotate(360deg);
}
}
@keyframes rotate {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
它只适用于Webkit浏览器。我做错了什么?你也必须用0
0s来定义秒。像这样:
-moz-animation: rotate 2s linear 0s infinite normal;
而不是这个
-moz-animation: rotate 2s linear 0 infinite normal;
检查此项为了更安全,最好选择在所有情况下使用s写入秒数
旋转2s线性0s无限法线;
显然这是正确的行为。