Javascript 在页眉上使用相同的背景色（透明），但不能从页面中看到内容

我正在做一个项目，我发现了一些我不知道/没有解决方案的东西，我在整个页面上使用主体背景，目前我将标题背景设置为透明，但在滚动页面上，页面内容是透明的，因为它是透明的

它的形象：

我想做的是添加背景，但当我添加相同的渐变时，它看起来并不像我希望的那样，我希望它看起来和身体上的背景一样，但因为头部的高度，渐变会发生变化，看起来与身体不同

在这里，背景填充与身体颜色相同时的外观

---

因此，我想要实现的是主体是渐变的，但内容不能通过标题看到，无论是通过填充颜色还是任何可以实现的方式。（它也可以是JS、Jquery或类似的工具）

我试着想出来，我只是继承了车身的颜色，它工作起来非常完美

body{
background: linear-gradient(30deg, blue 35%, lightblue 100%);
}

header{
background: inherit
}

---

只是不要使用对角线背景。使其从左向右呈线性；）或者不要对正文和标题进行渐变，因为这样会降低文本的可读性。我会留给你一点关于@RokoC.Buljan的聪明头脑的阅读，我的意思是它仍然是不同的，我不希望它与背景不同，你知道jquery或js在本例标题中隐藏特定元素下的内容吗