CSS3 properties transform (transformation), transition (transition), animation (animation)

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

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

Animation compatibility: https://www.cnblogs.com/warm-stranger/p/4910493.html

Multiple animations

When you want to add multiple animation effects to an element, you need to ,separate them, such as:

.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);
  }
}