Question

我正在编写一个简单的wordpress页面，并希望将鼠标悬停在其上方时更改菜单栏（右上方）的背景颜色。在以下网站上：https://www.happylogo.be/。我通常只是使用“添加其他CSS”来完成此操作，这只是一个CSS文件。奇怪的是，我相信我的选择器代码是正确的，因为当我添加“ visibility：hidden;”时悬停在li项上时，它会迅速消失并重新出现。

我现在使用的CSS代码：

var originalDate = "6/4/18 6:07 PM";
DateTime parsedDate;

var culture = System.Globalization.CultureInfo.CreateSpecificCulture("en-AU");
var styles = System.Globalization.DateTimeStyles.None;
if (!DateTime.TryParse(originalDate, culture, styles, out parsedDate))
{
       Console.WriteLine(parsedDate);
}

        Console.WriteLine($"Parse successfull: {parsedDate}");

但是它不起作用。将鼠标悬停在菜单项上时如何更改背景颜色？

Answer 1

这是由这一行CSS引起的。 <a>中<li>上有一个悬停。由于页面使用的是xhtml，因此悬停样式应位于<a>而非<li>上。如果您使用HTML5，则它可以位于<li>上。

#primary-nav ul li:hover > a, #sticky_menu li:hover > a {
    background-color: #000000;
}

Answer 2

我注意到您<a>内的<li>标签实际上是用黑色覆盖了悬停状态。

#primary-nav ul li:hover > a, #sticky_menu li:hover > a {
    background-color: #000000;
}

您可以删除此样式，也可以将<a>的悬停状态设置为所需的颜色。

悬停在li上时更改颜色

2 个答案: