可以激活一个或另一个，但不能同时激活和悬停

Question

因此，这比实际问题更像是一个OCD问题，但我仍然感到困惑，并希望获得一些指导。

我的下拉菜单的一部分要求是必须没有鼠标（通过标签）即可访问它。

这是一个简单的4标签：首页，关于，浏览，登录下拉菜单。

悬停时，它应该翻转背景颜色和文本（h3）颜色。  -很好

不用鼠标，用户应该可以将其切换到菜单上（工作正常），并使用向下箭头键在列表项之间切换。 （有效），并且每个人都“聚焦”时，背景和文本颜色都会变幻，就像悬停一样（也可以）

问题

如果我跳至菜单并向下箭头到“主页”，则主页列表项的颜色变淡。 但是，如果在该标签页处于焦点状态时，例如，我使用鼠标悬停在第三项上，那么第四项“ home”仍在焦点上（因此它具有反转的颜色）并保持这种方式而其他项目则按预期反转。

我的问题

如果有可能，如果我将鼠标悬停在一个单独的列表项上，或者如果我再继续向下箭头，则该如何打破焦点？从理论上讲，键盘用户不会使用鼠标（整个可访问性点），但是它并不完美，我很好奇。

.headerMenuLinks li a:hover, .headerMenuLinks li a:focus {
    color: #ffffff;
    background-color: #434343;
}

.headerMenuLinks li a:hover h3, .headerMenuLinks li a:focus h3 {
    color: #ffffff;