css - 悬停在子菜单上时的父悬停状态

Question

当悬停在子菜单链接上时，如何将三 Angular 形悬停状态包含到父链接中？ http://website-test-lab.com/sites/tcf/locals/

目前，css 三 Angular 形出现在悬停时和当前页面上时。如果您访问上面的链接并将鼠标悬停在关于链接上，然后将鼠标悬停在子菜单上，您会看到三 Angular 形消失了。我希望它留下来。

这是我的 CSS:

    .nav ul li a:hover:after,
.nav .current-menu-item:after,
.nav .current_page_parent:after {
    content: "";
    position: absolute;
    bottom: 0px;
    left: 28px;
    margin: 0 auto;
    display: block;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 0 31px 10px 15px;
    border-color: transparent transparent $pink transparent;
}   

提前致谢

Answer 1

您可能需要更改触发 :hover 的元素声明实际上你在 <a> 上有它标记将其更改为 <li> .

你有这个选择器:

.nav ul li a:hover:after 

将其更改为:

.nav ul li:hover > a:after