Javascript 粘性导航栏功能失调

我对网络开发比较陌生，我的一位家庭成员给我分配了一份实习“工作”。我的“粘性”功能有问题。这是一个带有下拉菜单的导航栏。当我尝试向下滚动以测试粘性函数时，它将不起作用

以下是我的代码示例：

.nav{
位置：粘性；
}
保险商实验室{
列表样式类型：无；
保证金：0；
填充：0；
背景色：#333；
显示：内联块；
最小宽度：3990px；
}
李{
浮动：左；
}
李a,，
.dropbtn{
显示：内联块；
颜色：白色；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
}
李a：悬停，
.dropdown:悬停.dropbtn{
背景色：红色；
}
li.下拉列表{
显示：内联块；
}
.下拉内容{
显示：无；
位置：绝对位置；
背景色：#f9f9f9；
最小宽度：160px；
盒影：0px 8px 16px 0px rgba（0,0,0,0.2）；
z指数：1；
}
.下拉内容a{
颜色：黑色；
填充：12px 16px；
文字装饰：无；
显示：块；
文本对齐：左对齐；
}
.下拉列表内容a：悬停{
背景色：#f1f1；
}
.下拉：悬停.下拉内容{
显示：块；
}

试试这个

.nav{
位置：固定；
}

试试这个

.nav{
位置：固定；
}

如果要使用sticky，则需要添加

top

或

bottom

属性。我建议您改用

position:fixed

body{/*仅查看滚动*/
最低高度：200vh；
背景：线性梯度（黑色、白色）；
}
.导航{
位置：粘性；
顶部：0.5rem；/*字体大小的一半*/
}
保险商实验室{
列表样式类型：无；
保证金：0；
填充：0；
背景色：#333；
显示：内联块；
最小宽度：3990px；
}
李{
浮动：左；
}
李a,，
.dropbtn{
显示：内联块；
颜色：白色；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
}
李a：悬停，
.dropdown:悬停.dropbtn{
背景色：红色；
}
li.下拉列表{
显示：内联块；
}
.下拉内容{
显示：无；
位置：绝对位置；
背景色：#f9f9f9；
最小宽度：160px；
盒影：0px 8px 16px 0px rgba（0,0,0,0.2）；
z指数：1；
}
.下拉内容a{
颜色：黑色；
填充：12px 16px；
文字装饰：无；
显示：块；
文本对齐：左对齐；
}
.下拉列表内容a：悬停{
背景色：#f1f1；
}
.下拉：悬停.下拉内容{
显示：块；
}

如果要使用sticky，则需要添加

top

或

bottom

属性。我建议您改用

position:fixed

body{/*仅查看滚动*/
最低高度：200vh；
背景：线性梯度（黑色、白色）；
}
.导航{
位置：粘性；
顶部：0.5rem；/*字体大小的一半*/
}
保险商实验室{
列表样式类型：无；
保证金：0；
填充：0；
背景色：#333；
显示：内联块；
最小宽度：3990px；
}
李{
浮动：左；
}
李a,，
.dropbtn{
显示：内联块；
颜色：白色；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
}
李a：悬停，
.dropdown:悬停.dropbtn{
背景色：红色；
}
li.下拉列表{
显示：内联块；
}
.下拉内容{
显示：无；
位置：绝对位置；
背景色：#f9f9f9；
最小宽度：160px；
盒影：0px 8px 16px 0px rgba（0,0,0,0.2）；
z指数：1；
}
.下拉内容a{
颜色：黑色；
填充：12px 16px；
文字装饰：无；
显示：块；
文本对齐：左对齐；
}
.下拉列表内容a：悬停{
背景色：#f1f1；
}
.下拉：悬停.下拉内容{
显示：块；
}

您好，欢迎光临。乍一看，这似乎并没有解决OP的问题。据推测，如果他们希望它是

固定的

，他们会使用它，但他们特别尝试让它作为

粘性的

运行。更改

位置可能会起作用，但似乎无法解决OP的问题。我误解你的建议了吗？你好，欢迎光临。乍一看，这似乎并没有解决OP的问题。据推测，如果他们希望它是
固定的
，他们会使用它，但他们特别尝试让它作为
粘性的
运行。更改
位置可能会起作用，但似乎无法解决OP的问题。我误解你的建议了吗？