html - 在背景图像动画之后创建背景色CSS3动画

我正在尝试在第一个动画是背景图像之后创建背景色CSS3关键帧动画。文本动画消失后，我无法创建另一个动画。文本动画淡出后，我希望背景的不透明度变为0.3，然后再次淡入文本。以下是我所拥有的。

请在此处查看完整代码：codepen：https://codepen.io/imdaone/pen/JJrYyV

.background {
  width: 80%;
  height: 220px;
  margin: auto;
  background: url(imgs/ad-ex.png) no-repeat top left;
  background-size: 100%;
  animation: move 5s 1 linear;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

最佳答案

看起来您正在尝试使用序列制作动画。如果我没有记错的话，那么纯CSS绝对不能做到。您可能想尝试使用一些javascript动画库来处理顺序动画。

您仍然可以使用Vanilla js，但我认为它仅是实现您想要的内容就比较繁琐