如何在物化 css 中更改 <li> 上的悬停颜色答案

【问题标题】：How to change hover color on a <li> in materialize css如何在物化 css 中更改 <li> 上的悬停颜色
【发布时间】：2020-01-22 00:23:59
【问题描述】：

我正在为我的网站使用物化 CSS 框架。我的网站上也有一个下拉菜单。当您单击它并显示属于其中的元素时，它们具有正确的背景颜色，但是当您将鼠标悬停时，它的行为就像它是白色的并且对白色进行着色。能否请我帮忙使它正确遮蔽我的黑色背景。

<ul id="games" class="dropdown-content" tabindex="0" style="display: block; width: 143.188px; left: 1222.81px; top: 0px; height: 94px; transform-origin: 0px 0px; opacity: 1; transform: scaleX(1) scaleY(1);">
<li tabindex="0" class="brand-black"><a href="#!">We have no games at the moment.</a></li>
</ul>

https://i.imgur.com/bN9mv5P.gif

【问题讨论】：

使用css覆盖悬停背景颜色，ul:hover {background: #000 !important;}

标签： html dropdown materialize

【解决方案1】：

.dropdown-content li:hover, .dropdown-content li.active {
background-color: #A10000 !important;
}

我更改了自定义下拉菜单的悬停颜色，并将其放入我的 styles.css 文件中。使用 !important 以确保应用更改。

【讨论】：