HTML中 css实现滚动页面时固定页面其中一栏的效果

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_33833327/article/details/78652284

可以为需要固定的元素加上 { position: fixed } 这个 CSS 属性，再通过 top left right bottom 属性调整位置。

---

（1）html中的代码：

<!--右侧导航栏-->

    <div class="navRight">

    </div>

（2）css样式中的代码：

/*右侧导航栏的样式*/
.navRight{
    width: 40px;
    height: 100%;
    float: right;
    position: fixed; /*滚动时可以固定在屏幕上*/
    top: 0;
    right: 0;
    background: rgb(38,38,38);
    z-index: 100;  /*在前100层上浮动*/
}

效果图如下：