css - 如何在右侧制作多种颜色渐变，但底部有发光效果？

Question

所以我试图制作像这样的渐变，但使用其他颜色：

所以，我对 css 有点陌生，我不知道如何在渐变下面制作这种发光效果，谢谢！

标签： css

Answer 1

背景图像可以包含多个图像 - 列表中的第一个图像覆盖后面的图像。

使用渐变图像，这个片段在从左到右的颜色渐变上从上到下将透明到一种深灰色的图像。

显然这只是一个开始，需要您使用参数和颜色来获得您想要的效果。

div {
  height: 10vh;
  background-image: linear-gradient(transparent 0, #404040 40%), linear-gradient(to right, cyan, magenta, yellow);
  background-size: 100% 100%;
  background-repeat: no-repeat no-repeat;
}

<div></div>