<div class="container">
    <nav>我是导航栏</nav>
    <div class="content">
        <p>我是内容栏</p>
        <p>我是内容栏</p>
        <p>我是内容栏</p>
        <p>我是内容栏</p>
        <p>我是内容栏</p>
        <p>我是内容栏</p>
        <p>我是内容栏</p>
        <p>我是内容栏</p>
    </div>
</div>
.container {
    background: #eee;
    width: 600px;
    height: 1000px;
    margin: 0 auto;
}

nav {
    position: -webkit-sticky;
    position: sticky;
    top:0;

}

nav {
    height: 50px;
    background: #999;
    color: #fff;
    font-size: 30px;
    line-height: 50px;
}

.content {
    margin-top: 30px;
    background: #ddd;
}

p {
    line-height: 40px;
    font-size: 20px;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.