CSS3属性transform(变形),transition(过渡),animation(动画)

transform链接:https://www.cnblogs.com/xiaomifeng/p/9139632.html

transition,animation链接:https://www.jianshu.com/p/ec150b884a3b

动画兼容:https://www.cnblogs.com/warm-stranger/p/4910493.html

多个动画

当要对一个元素添加多个动画效果时,需要用,分隔开来,如:

.element {
  animation: fadeIn 4s 1s infinite linear alternate,
            rotate 4s 1s infinite linear alternate;
}

@keyframes fadeIn {
  to {
    opacity: 0;
  }
}

@keyframes rotate {
  to {
    transform: rotate(180deg);
  }
}

猜你喜欢

转载自www.cnblogs.com/wskb/p/12739728.html