好的，所以我需要制作一个对用户来说看起来固定的标题，但它应该放在导航栏后面。我的代码是这样的：
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/styles/globalStyles.css">
<link rel="stylesheet" href="index.css">
<link rel="stylesheet" href="/styles/headerStyling.css">
<link rel="shortcut icon" href="/assets/img/favicon.ico" type="image/x-icon">
<title>Webwomen</title>
<meta
name="description"
content="Está procurando oportunidades de estágio, emprego ou bolsas de estudo?
Ou até mesmo oportunidades para atender eventos de tecnologia no Brasil
e ao redor do mundo?"
/>
</head>
<body>
<header>
<nav><p>header</p></nav>
<img src="../../assets/img/header-img.png" class="header--image" alt=""></header>
<main>
<div class="testMovingImage"></div>
</main>
<script src="jobsData.js"></script>
<script src="index.js"></script>
</body>
</html>
body {
position: absolute;
}
.header--image {
position: relative;
top: 0;
left: 0;
}
我真的尝试了所有的东西，但它一直在我的窗口向下滚动
position: absolute会将子元素定位到其下一个相对祖先元素(默认为主体)。因此，它将保持该父元素的位置并与其一起滚动。如果您想将元素保持在屏幕(视口)的顶部，则需要使用sticky或fixed来定位它。
position: fixed会将元素移出流，并将其定位到视口中。sticky不会将其完全移出流。它将保持它仍然是父元素的一个元素，并在父元素离开屏幕后立即移出屏幕。
header {
position: fixed;
top: 0;
}
/* for visualisation purpose only */
body {
min-height: 1000vh;
background: linear-gradient(to bottom, red 0, green 50%, blue 100%);
}<header>
<h1>HEADER</h1>
</header>body{background:#ff0000; min-height:1000ch; padding:0 auto; margin:0 auto;}
header{background:#000; width:100vw; height:70px; position:fixed;}
nav{width:90vw; float:right;}
nav p {color:#fff; font-size:2em; text-align:left; margin:0 auto; padding:10px 0;}
.header-image{width:10vw;}
img{max-height:70px;}<header>
<nav><p>header</p></nav>
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRdHO6b9-w3GKg6WiuzHKUcUsLc2bHrg1nxgQ&usqp=CAU" class="header--image" alt="">
</header>