Geringerer Z-Index des absolut positionierten Bildes, das nicht hinter anderen Seitenabschnittselementen verborgen ist ⇐ CSS

[Guest]

Es gibt ein Bild, das ich im Hintergrund des Heldenbereichs haben möchte. Ich möchte, dass es hinter mehreren Elementen verborgen bleibt. Die Z-Index-Eigenschaft scheint nicht zu funktionieren, da ich versucht habe, die Z-Indizes anderer Elemente zu erhöhen und die dieses Hintergrundbilds zu verringern, aber es funktioniert immer noch nicht.
Die Der Figma-Bildschirm dafür ist dieser:


Die Benutzeroberfläche, die ich nutzen kann entwickeln ist das:


Mein Header ist fest oben auf der Seite positioniert. Darunter folgt der Heldenabschnitt.
Das ist mein Code für den blau gekachelten Abschnitt:

Code: Select all

Dies ist der Code für die Zielseite:

Code: Select all

const LandingPage = () => {
return (















);
};

So beginnt der Heldenabschnitt:

Code: Select all

.....

Dies ist der Code für den Header-Abschnitt:

Code: Select all

....

Ich verschiebe den Code hier und da zwischen und innerhalb verschiedener Divs, aber das funktioniert auch nicht.