查漏补缺——说说position: sticky;

问题

如图所示

答案

相关源码：

#article-menus{
        position: sticky;
        top: 0;
        box-shadow: 0 2px 6px rgba(0, 0, 0, .1);
        border-radius: 3px;
        padding: 15px;
        width: 300px;
        transform: translateX(-120%) translateY(150px);
        font-size: 14px;
    }

css粘性定位position：sticky问题采坑

综上所述，position: sticky;是相对定位relative和fixed固定定位的结合，这里主要结合top: 0;来实现，当距离top为0px时，样式表现为固定在顶部。