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

Question

我正在尝试让我的网站背景以浅蓝色背景颜色开始，最后以稍微深一点的蓝色结束。

有没有编码的方法？或者我应该放一张图片作为背景（如果没有其他选择）？

这是我希望我的背景具有的确切颜色的图像：

请忽略图片中的云彩，只检查颜色。

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

你可以试试 linear-gradient。 Click here for more information

有关哪些浏览器支持它的更多信息，请参阅此内容：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>

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

how to make background color from bright blue to dark blue using css/html/js

html

javascript

css

background