css3动画 有哪些

CSS3动画是一种可以通过CSS样式语言来实现动画效果的技术。它可以使网站元素更生动，让用户更加愉悦地使用。

以下是CSS3动画的一些常见效果：

/* 旋转动画效果 */
.rotate {
  animation: rotate 2s linear infinite;
}

@keyframes rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* 缩放动画效果 */
.scale {
  animation: scale 1s cubic-bezier(0.42,0.58,1) infinite alternate;
}

@keyframes scale {
  from { transform: scale(1); }
  to { transform: scale(1.5); }
}

/* 移动动画效果 */
.move {
  animation: move 2s ease-in-out infinite;
}

@keyframes move {
  from { transform: translateX(0); }
  to { transform: translateX(200px); }
}

/* 透明度动画效果 */
.opacity {
  animation: opacity 3s linear infinite;
}

@keyframes opacity {
  0% { opacity: 1; }
  50% { opacity: 0.5; }
  100% { opacity: 1; }
}

以上是CSS3动画的一些常见效果，可以帮助网站更加生动有趣。但是要注意，在使用CSS3动画时需要考虑兼容性问题，因为一些旧版浏览器可能不支持CSS3动画，需要使用JS等其他技术来实现动画效果。