导航栏中的链接不会将我发送到下一页，但会消失

Question

我有一个焦点转移。通常，当我单击页面上的其他位置时，它会消失，但是当我单击下拉菜单中的链接之一时，它也会消失！在我再次单击导航栏中的按钮之前，如何保持它可见！？

CSS：

.nav-item:focus {
    background-color: #444;
}

.nav-item:focus ~ .nav-content {
    max-height: 400px;
    -webkit-transition:max-height 400ms ease-in;
    -moz-transition:max-height 400ms ease-in;
    transition:max-height 400ms ease-in;


} 

Answer 1

.nav-item 是表单元素吗？否则选择器focus 将无法使用它，您应该为此使用javascript。另外，.nav-item:focus ~ .nav-content中不需要这个'~'：

.nav-item:visited .nav-content {
    max-height: 400px;
    -webkit-transition: max-height 400ms ease-in;
    -moz-transition: max-height 400ms ease-in;
    transition: max-height 400ms ease-in;
}