CSS 设置实现 div 背景色渐变

如下:

background: -webkit-linear-gradient(top, deepskyblue, skyblue, lightblue, white);

1、设置 div 渐变,首先使用一个 div 标签。

image.png

2、然后在 header 标签里面设置

标签的 css 样式。

image.png]

3、颜色渐变要有一个范围,所以小伙伴们需要给 div 设定 width 和 height,也就是宽度和高度。

image.png]
4、 然后设定 div 的 background 背景属性,如图所示,背景颜色渐变就用到 -webkit-linear-gradient。

image.png]

5、接着,在 -webkit-linear-gradient 里面写 top,设定渐变从顶部开始,到底部结束。在这里需要注意的是,写了 top 就不要写 bottom 了哦。

image.png]

6、 之后,再设定颜色的渐变顺序,比如我设置了从白色渐变到蓝色。温馨提示,颜色可以设定多个的哦。

image.png]

7、做完这些之后,div 背景渐变就成功了哦,是不是很有层次感呢?

image.png]

  
    展开阅读全文