CSS 悬停未按预期工作。为什么？

Question

我试图在列表项中设置一个锚点，以便在鼠标悬停时改变颜色。它对 PORTFOLIO 和 CONTACT 无法正常工作（当我将鼠标悬停在 ABOUT 上时，CONTACT 会改变颜色）但它对 HOME 和 ABOUT 根本不起作用（HOME 和 ABOUT 根本不会改变颜色）。为什么会这样？

这是我的 CSS 代码：

 li a:hover{color: #E3872D;}

这是我的 HTML 代码：

 <div class="leftpart_wrap">
        <ul class="navbar">
            <li><a href="#home">Home</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#portfolio">Portfolio</a></li>
            <li><a href="contact">Contact</a></li>
        </ul>

    <div class="leftpart_bottom">
            <ul id="icons">
                <!--Icons go here and their hovering attribute works perfectly-->
            </ul>
    </div>
    </div>

Answer 1

可能是几件事。您的代码是正确的，但您的 CSS 中可能有一些覆盖样式。尝试使用更具体的 CSS 看看它是否解决：

.navbar li a:hover{color: #E3872D;}

CSS 悬停未按预期工作。为什么？

CSS Hover is not working as intended. Why?

html

css

hover