css 导航栏固定

0 环境

• 系统:：win10
• 编辑器：vscode

1 前言

复制网上的代码 虽然导航栏固定了 加个上边距 看似没问题 滚动文章内容(导航栏下面是文字列表)会出现稀奇古怪的问题

2 具体解决

1 网上的代码

导航栏 {
    position: fixed;
    width: 100%;
    top: 0;
    z-index:9999; 
}

文章 {
    margin-top: 导航栏的高度;
}

<div>
        <div>导航栏</div>
        <div>文章</div>
        ...
<div>

2 更改

用其他方式也可以 这种的 最省事 导航栏 文章 最外层加个div包裹这个问题完美解决

导航栏 {
    position: fixed;
    width: 100%;
    top: 0;
    z-index:9999; 
}

文章+其他... {
    margin-top: 导航栏的高度;
}


<div>
    <div class="">导航栏</div>
    <div class="">文章+其他...</div>
<div>