动画渐变背景CSS

Question

我试图为body html标记的背景设置动画，这是CSS中的线性渐变颜色。动画正在运行，但没有过渡。请帮助。

body {
  animation: gradientAnim 2s;
  animation-iteration-count: infinite;
}

@keyframes gradientAnim {
  0%{
    background: linear-gradient(45deg,orange,yellow);
  }
  50%{
    background: linear-gradient(45deg,yellow,red);
  }
  100%{
    background: linear-gradient(45deg, red, orange);
  }
}