关于含有position: fixed的元素与其他元素在html中的顺序问题

    <style>
        .w {
            width: 800px;
            height: 1400px;
            margin: 0 auto;
            background-color: rgba(0,0,0,0.2);
        }
        .fixed {
            position: fixed;
            width: 50px;
            height: 50px;
            left: 50%;
            margin-left: 400px;
            background-color: red;   
        }
    </style>
</head>
<body>
    <!-- fixed和w的位置不能调换，否则小盒子会消失 -->
    <!-- 我也不知道为什么 -->
    <div class="fixed"></div>
    <div class="w"></div>
</body>

在html中，为什么.fixed元素必须在.w元素前面，.fixed元素才会显示。调换两个元素的前后位置，让.fixed在.w的后面，.fixed元素就不显示了

没有消失，而是被挤到下面去了，给fixed 加一句代码 top:0 就可以了

看下这篇博客，也许你就懂了，链接：HTML之我才是定位王者：全面击破position属性(+文档流+absolute重叠、fixed问题)

其实没有消失

你给 fixed 加一个 z-index : 1 就可以试一下 , 如有帮助给个采纳谢谢谢