css的渐变色在定义多个块元素时出现了断层和重复,如下图


如图,颜色出现了很明显的分割


解决方法

添加一句background-attachment: fixed;

background-attachment :定义背景图片随滚动轴的移动方式,取值: scroll | fixed | inherit


补充资料

CSS: linear-gradient() 函数

background-image: linear-gradient(direction, color-stop1, color-stop2, ...);

描述
direction用角度值指定渐变的方向(或角度)。
color-stop1, color-stop2,...用于指定渐变的起止颜色。


CSS: background-attachment 属性

描述
scroll背景图片随着页面的滚动而滚动,这是默认的。
fixed背景图片不会随着页面的滚动而滚动。
local背景图片会随着元素内容的滚动而滚动。
initial设置该属性的默认值。
inherit指定 background-attachment 的设置应该从父元素继承。
最后修改:2022 年 09 月 15 日
你的支持是我最大的动力