css淡入淡出动画效果

要创建CSS淡入淡出动画效果，可以使用CSS的`@keyframes`规则和`opacity`属性。以下是一个示例：

.fade-in-out {
  animation: fade 2s infinite;
}

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

在上面的示例中，我们创建了一个名为`fade`的关键帧动画。它从0%开始，将元素的不透明度设置为0，然后在50%时将不透明度设置为1，最后在100%时将不透明度再次设置为0。

然后，我们将`.fade-in-out`类应用于要应用动画效果的元素。在这个例子中，动画会无限循环播放，你也可以根据需要调整动画的持续时间和循环次数。

你可以根据自己的需求自定义动画的其他属性，例如添加`transition-timing-function`来改变过渡的速度曲线，或者添加`animation-delay`来延迟动画的开始时间等等。