使用css颜色背景渐变写一个动画让html背景颜色动态变化

你可以使用CSS中的动画和渐变属性来实现HTML背景颜色动态变化的效果。以下是一个示例代码：

HTML:

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
  <div class="background-animation"></div>
</body>
</html>

CSS (style.css):

.background-animation {
  width: 100%;
  height: 100vh;
  animation: colorChange 5s infinite;
}

@keyframes colorChange {
  0% {
    background: linear-gradient(to right, red, blue);
  }
  50% {
    background: linear-gradient(to right, blue, green);
  }
  100% {
    background: linear-gradient(to right, green, red);
  }
}

在上面的代码中，我们创建了一个名为background-animation的<div>元素，并将其设置为占满整个屏幕。通过CSS的animation属性，我们将colorChange动画应用于该元素，并设置了5秒的动画周期。colorChange动画定义了三个关键帧，分别在0%、50%和100%的时间点设置不同的背景渐变颜色。

通过这个代码，你可以在浏览器中看到HTML背景颜色动态变化的效果