如何使用 css/html/js 将背景颜色从亮蓝色变为深蓝色

Question

我试图让我的网站背景以浅蓝色背景颜色开始，最终以略深的蓝色结束。

有没有办法编码？ 或者我应该把图像作为背景（如果没有其他选择）？

这是带有确切 colors 的图像，我希望我的背景具有：

请忽略图像中的云，仅检查 colors。

Answer 1

使用渐变

 main { height: 100vh; background: linear-gradient(skyblue, darkblue); }

 <main></main>

Answer 2

你应该使用linear-gradient

 .background{ width: 100vw; height: 100vh; background-image: linear-gradient(to bottom, cyan, blue); }

 <div class="background"> </div>

Answer 3

你可以试试线性渐变。 点击这里查看更多信息

有关哪些浏览器支持它的更多信息，请参阅此内容： https://caniuse.com/?search=linear-gradient

这是一个例子：

 #grad1 { height: 200px; background-color: blue; /* For browsers that do not support gradients */ background-image: linear-gradient(#0000FF, #000044); }

 <div id="grad1"></div>