css - ul ul li a 对颜色没有反应

Question

嘿，我正在尝试制作：

ul ul li a在一个nav颜色#FFF

但无论我做什么，我都无法改变它，我认为可能是：

ul li a影响它但是那是#FFF什么？

我的目标是深色背景上的白色文本，然后是白色上的黑色文本hover。

到目前为止，这是我的代码：

CSS：

nav ul ul li

{
    background: #4a4a4a;
    float: none; 
    position: relative;
   color: #FFF;
}

    nav ul ul li a 

{
    color: #FFF;
    padding: 10px 51px;
}

    nav ul ul li a:hover 

{
    background: #FFF;
    color: #000;
}

HTML：

<nav>
                <ul>
                    <li><a href="#">Home</a></li>
                    <li><a href="#">Services</a></li>
                    <li><a href="#">Our Prices</a></li>
                    <li><a href="#">Web Design</a>
                        <ul>
                            <li><a href="#">Portfolio</a></li>
                            <li><a href="#">Pricing</a></li>
                        </ul>
                    </li>
                    <li><a href="#">Consulting</a></li>
                    <li><a href="#">Quick Hire</a></li>
                </ul>
            </nav>

任何帮助都会非常感谢:)。

Answer 1

我认为您正在尝试在这里实现相同的目标：

JSbin 演示

    导航
    {
     背景：#4a4a4a；
     浮动：无；
     位置：相对；
     颜色：#FFF；
    }

    导航 ul ul li a
    {
     颜色：#FFF；
     填充：0px 51px；
    }

    导航 ul ul li:hover
    {
     背景：#FFF；
    }

    nav ul ul li:hover a
    {
     背景：#FFF；
     颜色：#000；
    }
    导航 ul ul li a:hover
    {
     背景：#FFF；
     颜色：#000；
    }

Answer 2

这些很可能是您已经访问过的 URL，这会导致浏览器以不同的颜色显示它们。

添加a:visited而不只是添加a到 CSS 选择器。

nav ul ul li a, nav ul ul li a:visited