我已经搜索了一段时间,并尝试了一些方法,但是无法使#topDiv我的代码随页面滚动。我尝试将位置设置为,position: sticky但这还没有完成。
这是我的代码:
body {
background-size: cover;
width: 100%;
height: 100%;
overflow: auto;
overflow-x: hidden;
}
#topDiv {
height: 50%;
width: 100%;
background: url(https://placehold.it/1000x200);
background-position: center;
background-size: cover;
background-repeat: no-repeat;
position: sticky;
}
#bottomDiv {
min-height: 50%;
}Run Code Online (Sandbox Code Playgroud)
<body id="background" onresize="VerticalAlign();">
<div id="topDiv">
<img id="icon">
</div>
<div id="bottomDiv">
<div id="textBox">
<h1 id="header" class="check-element">Header</h1>
<h2 id="subheader1" class="moveSub1 check-element">Subheader</h2>
<p id="text1" class="movePara1 check-element">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nec leo quam. Proin vulputate convallis augue …Run Code Online (Sandbox Code Playgroud)