Html 滚动框不工作/滚动时使相对定位元素消失在固定元素下_Html_Css

Html 滚动框不工作/滚动时使相对定位元素消失在固定元素下

html css

Html 滚动框不工作/滚动时使相对定位元素消失在固定元素下,html,css,Html,Css,我是一个网页设计的初学者，我有困难使一个滚动框的工作。我试图有一个相对位置的元素能够与一个固定的标题（导航栏）滚动和相对元素去下面或'消失'一旦它的滚动了 <html> <style> .toplinks{ position:fixed; list-style-type: none; margin-top:70px; margin-left:300px; padding:0; font-size: 18px; overflow: hidden; background-

我是一个网页设计的初学者，我有困难使一个滚动框的工作。我试图有一个相对位置的元素能够与一个固定的标题（导航栏）滚动和相对元素去下面或'消失'一旦它的滚动了

<html>
<style> 

.toplinks{
position:fixed;
list-style-type: none;
margin-top:70px;
margin-left:300px;
padding:0;
font-size: 18px;
overflow: hidden;
background-color: white;
display: block;
color: black;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}

#paragraph{
font-size: 15px;
position:relative;
overflow:auto;
width:65%;
height:30%;
top:250px;
left:250px;
z-index:-3;
}
</style>

<body>
<div class="toplinks">
<ui> <li> link</li>
<li><link</li>
<li>link</li>
<li>link</li></div>

<div id="paragraph"> heres a block of text that will probably also
have a picture that I want to be able to be scrollable with 
the navigation bar up top fixed </div> 
</body>
</html>


.toplinks{
位置：固定；
列表样式类型：无；
利润上限：70像素；
左边距：300px；
填充：0；
字号：18px；
溢出：隐藏；
背景色：白色；
显示：块；
颜色：黑色；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
}
#段落{
字体大小：15px；
位置：相对位置；
溢出：自动；
宽度：65%；
身高：30%；
顶部：250px；
左：250px；
z指数：-3；
}
链接
@杰米·西奥菲洛斯
首先，你的代码有很多问题，比如你没有关闭ul标签，使用你的代码中有很多不正确和/或不必要的东西。例如，它是
而不是，您需要一个结束标记。这不会解决你的问题，只是想让你意识到。如果你可以发布一个链接到一个具有你想要的功能的网站，我可以帮助你，但是用你的代码，你需要重新开始。我们以youtube为例。当你滚动时，提要中的视频都会上升，然后消失在导航栏后面？这有意义吗？
<div class="toplinks">
<ul>
<li>link</li>
<li>link</li>
<li>link</li>
<li>link</li>
</ul>
</div>
<div id="paragraph"> heres a block of text that will probably also
have a picture that I want to be able to be scrollable with 
the navigation bar up top fixed heres a block of text that will probably also
have a picture that I want to be able to be scrollable with 
the navigation bar up top fixed heres a block of text that will probably also
have a picture that I want to be able to be scrollable with 
the navigation bar up top fixed heres a block of text that will probably also
have a picture that I want to be able to be scrollable with 
the navigation bar up top fixed heres a block of text that will probably also
have a picture that I want to be able to be scrollable with 
the navigation bar up top fixed also
have a picture that I want to be able to be scrollable with 
the navigation bar up top fixed heres a block of text that will probably also
have a picture that I want to be able to be scrollable with 
the navigation bar up top fixed also
have a picture that I want to be able to be scrollable with 
the navigation bar up top fixed heres a block of text that will probably also
have a picture that I want to be able to be scrollable with 
the navigation bar up top fixed also
have a picture that I want to be able to be scrollable with 
the navigation bar up top fixed heres a block of text that will probably also
have a picture that I want to be able to be scrollable with 
the navigation bar up top fixed</div>

.toplinks{
position:fixed;
list-style-type: none;
margin-top:70px;
margin-left:150px;
padding:0;
font-size: 18px;
overflow: hidden;
background-color: white;
display: block;
color: black;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}

#paragraph{
font-size: 15px;
position:relative;
overflow:auto;
width:65%;
height:30%;
top:250px;
left:150px;
z-index:-3;
}