Html 将鼠标移向菜单本身时，会出现下拉菜单

当鼠标离开“公司”链接并指向菜单本身时，下拉菜单将消失。 我正在尝试实现一个无需点击链接即可访问的可悬停下拉菜单
我在stack上搜索并尝试了各种各样的解决方案，但都不起作用

.nav下拉列表{
位置：绝对位置；
边缘顶部：10px；
宽度：200px；
高度：200px；
显示器：flex；
证明内容：周围的空间；
对齐项目：居中；
弯曲方向：立柱；
列表样式：无；
边界半径：0 20px 20px 20px；
不透明度：0；
指针事件：无；
转换：translateY（-10px）；
过渡期：所有0.6秒缓解；
}
.nav链接：悬停+导航下拉列表{
背景色：白色；
不透明度：1；
指针事件：全部；
转换：转换（0px）；
盒影：0 5px 5px#999；
颜色：#cf20fb；
}
.nav下拉链接a{
文字装饰：无；
字号：18px；
颜色：#567ff4；
}
.导航下拉列表李{
宽度：100%；
身高：100%；
显示器：flex；
对齐项目：居中；
证明内容：中心；
}
.导航下拉列表li:悬停，a:悬停{
颜色：#cf20fb；
}

链接和下拉列表之间存在差距。我在

.nav链接上使用了一个伪元素来填充它，这样用户在鼠标向下移动到下拉菜单时有一点缓冲

然后，您的下拉列表在悬停时没有设置为保持可见，所以我只是将
.nav dropdown:hover
添加到该样式集，以便只要鼠标在其边界内，它就会保持打开状态


.nav下拉列表{
位置：绝对位置；
边缘顶部：10px；
宽度：200px；
高度：200px；
显示器：flex；
证明内容：周围的空间；
对齐项目：居中；
弯曲方向：立柱；
列表样式：无；
边界半径：0 20px 20px 20px；
不透明度：0；
指针事件：无；
转换：translateY（-10px）；
过渡期：所有0.6秒缓解；
z指数：2；
}
.nav-link.has-dropdown{
位置：相对位置；
}
.nav链接。已下拉：悬停：之后{
内容：''；
位置：绝对位置；
显示：块；
排名：0；
左：0；
右：-30px；
底部：-30px；
}
.导航链接：悬停+导航下拉菜单，
.导航下拉菜单：悬停{
背景色：白色；
不透明度：1；
指针事件：全部；
转换：转换（0px）；
盒影：0 5px 5px#999；
颜色：#cf20fb；
}
.nav下拉链接a{
文字装饰：无；
字号：18px；
颜色：#567ff4；
}
.导航下拉列表李{
宽度：100%；
身高：100%；
显示器：flex；
对齐项目：居中；
证明内容：中心；
}
.导航下拉列表li:悬停，a:悬停{
颜色：#cf20fb；
}














不得不切换.nav-link.has下拉列表：hover:before{}，rest工作起来很有魅力。非常感谢。