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

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;
}