1、转动效果
animation: amountRotate 10s linear infinite;
@keyframes amountRotate {
from {
transform: translate(0) rotate(0deg);
}
to {
transform: translate(0) rotate(360deg);
}
}
2、心跳动画
animation: scaleDraw 3s ease-in-out infinite;
// 放大缩小
@keyframes scaleDraw {
0%{
transform: scale(1);
}
25%{
transform: scale(1.1);
}
50%{
transform: scale(1);
}
75%{
transform: scale(1.1);
}
}
3、往复动画
animation: amountOne 10s linear infinite;
@keyframes amountOne{
0% {
transform: translate(0) rotate(0deg);
}
50% {
transform: translate(0) rotate(45deg);
}
100% {
transform: translate(0) rotate(0deg);
}
}