我不知道为什么，但我的下拉菜单在悬停在屏幕上时拒绝停留在屏幕上。当我使用CSS中的:focus使它们可点击时，它们工作得很好：

.下拉菜单>；.link：焦点+.下拉菜单

但是，我想让他们在悬停上工作。但当我将其设置为以下内容时，只要您将鼠标从菜单标题上移开，下拉菜单就会消失：

.下拉菜单>；.link：悬停+.下拉菜单

下面是JSFiddle上的代码-->；https：//jsfiddle.net/l8u96pbr/.

什么来让它工作？

顺晟科技：

下拉菜单消失的原因是，当您将光标从类link移动到类dropdown-menu的下一个同级时，它会取消悬停link添加padding，如果您希望它占用相同的空间量，则可以向padding添加相同值的负边距（例如，添加link）.

此外，您的选择器.link { padding: 10px; margin: -10px; }悬停时，.link：hover+.dropdown-menu仅影响类.dropdown > .link:hover + .dropdown-menu悬停时，您希望保持同样的效果，因此也添加dropdown-menu。

<代码>.下拉菜单>；.link：悬停+.下拉菜单，.下拉菜单：悬停{不透明度：1；变换：translateY（0px）；指针事件：自动；}

下拉菜单消失是因为您的CSS告诉它仅当您将鼠标悬停在.link

而不是这个：

<代码>.下拉菜单>；.link：悬停+.下拉菜单{不透明度：1；变换：translateY（0px）；指针事件：自动；}

此操作：

<代码>.下拉菜单：悬停.下拉菜单{不透明度：1；变换：translateY（0px）；指针事件：自动；}

谢谢你会修理它