将鼠标悬停在下拉列表中时，如何将悬停效果保留在导航栏上？

Question

我的导航栏上有悬停效果，我刚刚添加了一个下拉列表。 当我将鼠标悬停在列表中时，它会丢失悬停效果。如何保持悬停效果？ 我目前的CSS： .navbar-list:hover {color:red;}

HTML：

<li class="dropdown"> <a href="#" class="navbar-list dropdown-toggle" data-toggle="dropdown"> About Us </a> <ul class="dropdown-menu"> <li><a href="company-profile.html">Company Profile</a></li> <li><a href="board-of-director.html">Board of Director</a></li> </ul> </li> 当我将鼠标悬停在列表中时，如何添加css以使其具有悬停效果？

Answer 1

根据您的代码，您需要像这样更改您的css选择器。

salaries.payment / SUM(tasks.finish_time::timestamp::time - tasks.init_time::timestamp::time)

/*
.navbar-list:hover {color:red;}
*/
.dropdown:hover {color:red;}

css选择器<li class="dropdown"> <a href="#" class="navbar-list dropdown-toggle" data-toggle="dropdown"> About Us <!-- Or you can put your dropdown-menu here <ul class="dropdown-menu"> <li><a href="company-profile.html">Company Profile</a></li> <li><a href="board-of-director.html">Board of Director</a></li> </ul> --> </a> <ul class="dropdown-menu"> <li><a href="company-profile.html">Company Profile</a></li> <li><a href="board-of-director.html">Board of Director</a></li> </ul> </li>表示

.navbar-list:hover {color:red;}，其中不包含<a href="#" class="navbar-list dropdown-toggle" data-toggle="dropdown">About Us </a>。

因此您可以更改css选择器或html结构以满足您的请求。