Html 滚动时防止内容div与标题div重叠

嗨，我有两个div

<div id="header">
  -- some random html content here --
</div>

<div id="content">
    1
    2
    3
    4
    5
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    ...
    some long content that needs scrolling. 
</div>

我希望窗口滚动条只滚动正文内容。我希望避免更改body标签的css，因为我的部分是整个页面的一个子部分

我不希望“内容”div覆盖/重叠“标题”div。（标题应保持固定并始终显示在顶部。用户应能够在不覆盖/重叠标题的情况下滚动正文内容

---

你的问题有点让人困惑，但我从中得到的是，你需要滚动页面的一部分，并防止部分页面不滚动？使用position:fixed而不是position:absolute应该让你的div显示“这里有一些随机的html内容”将防止其向下滚动。若要使标题与正文重叠，请将其设置为

背景色：白色

。我制作了一个工作示例

是的，我希望标题保持固定，滚动条仅滚动内容。我可以使标题保持固定，但当我这样做时，正文的内容将与标题重叠/重叠我不想这样。结合背景色：白色和z-指数为10的位置解决了这个问题，给了我想要的

#header {
        vertical-align:middle; 
        position:fixed; 
        top:0ex; 
        width:800px;
        height: 48px;
        background-color: #FFFFFF;
        z-index: 10;
    }

    #content {
        text-align:center; 
        margin-left:auto; 
        margin-right:auto; 
        width: 800px;
        margin-top: 24px;
    }

#header {
    vertical-align:middle; 
   /* position:absolute; */position:fixed;
}
z-index:
    top:0ex; 
    width:800px;
}