使用 css 创建粘性/固定导航栏的问题

如何解决使用 css 创建粘性/固定导航栏的问题

我正在制作一个网站，顶部栏需要在当前位置保持粘性。

请检查我的 git hub 存储库中的代码，因为它太大而无法容纳 my github repository

基本上我知道我们可以通过使 div 标签 .dropna 或 position: fixed; 以两种方式做到这一点，但它们都不起作用。

解决方法

只需确保您的 div 具有以下样式：

position: fixed;
top: 0px;

顶部可以具有您想要的任何值。如果您希望它位于页面的最顶部而没有边距，请将其设为 0，或者设为 10px，例如您希望它位于窗口顶部下方 10 个像素处。

这将确保无论您滚动到何处，您的 div 或标题始终位于该特定位置。

,

要解决这个问题，您可以简单地使用：

.sticky{
    position: fixed;
    top: 0;
    width: 100%;
}

position 和 top 已经由其他用户解释过，但宽度也需要保持导航栏的原始形式，否则导航栏的组件会因失去位置而变形。

在您的第一张图片中，我们可以看到组件已损坏