Javascript标签无效

Question

当我点击navbar上的标签时，它会转到标签页，但是一旦我将鼠标移开，它将不再显示它已被选中，但它会保留它。文字颜色。

以下是完整代码：

Html：https://codetidy.com/8744/

CSS：https://codetidy.com/8745/

这样我可以更好地解释我的问题是一个例子：

加载网站

将鼠标悬停在“约”标签上以点击它

然后在单击选项卡后，鼠标已移开，但选项卡不会保持红色

Answer 1

尝试向自定义CSS添加更具体的CSS选择器：

.nav > li > a:focus, .nav > li > a:hover {
   background-color: red;
}

Working example of your code (after adding the class above)

Answer 2

正如我在你的html代码中看到的那样，为什么你有一个用于标签的onClick功能。已经有一个bootstrap选项卡的文档。您只需清理您的CSS也可以获得所需的输出。你可以用css做这样的事情，但如果你为导航栏输入一个id就好了。

默认：

.nav > li { 
//enter code here  
}

悬停：

.nav > li:hover { 
//enter code here  
}

选自：

.nav > li.active { 
//enter code here  
}