Html 粘滞位置不适用于div元件

我试图使一个div相对于视口的位置保持粘性，这样当它从视图中滚动出去时，它会粘在顶部，但它不起作用

#导航{
显示器：flex；
背景色：#AA1111；
宽度：100%；
高度：50px；
z指数：10；
位置：粘性；
职位：-网络工具包粘性；
排名：0；
}
标题{
高度：自动；
显示器：flex；
}

---

当父元素仍然可见时，Sticky将粘贴到顶部。话虽如此，您的父元素（header）只包含sticky元素，因此将像导航一样从视图中滚出来。如果标题中有另一个具有一定高度的元素，则导航将一直保持在顶部，直到该元素也滚动出视图

正如其他人所说，sticky并没有很好的浏览器支持，也许您正在寻找的只是position:fixed

#导航{
显示器：flex；
背景色：#AA1111；
宽度：100%；
高度：50px；
z指数：10；
位置：粘性；
职位：-网络工具包粘性；
排名：0；
}
身体{
最小高度：5000px；
}
.其他{
高度：500px；
背景：蓝色；
}

知识是一种美德，是一种美德，是一种美德，是一种美德。但是，在最低限度上，我们需要一个实验室来进行日常工作。两人或两人在一个无教区的房间里互相指责。除了偶尔出于谨慎，还必须为动物的劳动负责

备选方案@这是因为我即将发布相同的解决方案，但您可以提到

位置：sticky

应该位于

位置：-webkit sticky

之后（或者，任何未固定的属性都应该位于前缀值之后）。不幸的是，我需要“粘性”提供的效果，因为我不希望它总是粘在视口的顶部。我可能只会使用JavaScript来检测它何时被滚动出视图，并对其应用固定定位。谢谢@MrLister提出了一个很好的观点，您应该首先将供应商的版本作为前缀，然后再将真实版本作为前缀。这可能会有所不同。