Question

我使用样式表创建了一个css菜单和子菜单。代码和样式表如下

 <style type="text/css">
*{
padding:0px;
margin:0px;
}

#navdiv
{
border: 1px solid black;
text-align:center;
background:#FF0000;
border-radius: 10px;
width: 50%;
margin: 10px;
}

nav ul ul
{
    display:none;
    width:auto;
}

nav ul li:hover >ul
{
    display:block;
}

nav ul
{
    background: #ff0000; 
    padding: 0px;
    border-radius: 0px;  
    list-style: none;
    position: relative;
    display: inline-table;
    font-size: 12px;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-transform:uppercase;
}

    nav ul li
{
    float:left;
    background: #ff0000;
    border: 0px solid black;
}

nav ul li:hover
{
    background: #DDDDDD;
    }

nav ul li a
{
    display:block;
    padding: 10px 25px;
    text-decoration: none;
    color:#FFFFFF;
}

nav ul li:hover a
{
    color:#000000;
}

nav ul ul 
{
    background: #ff0000;
    position: absolute; top: 100%;
}

nav ul ul li 
{
    float: none; 
    border: 1px solid #000000;
    position: relative;
    color:#FFFFFF;
}

nav ul ul li a 
{
    background-color: #FFFFFF;
    color: #FFFFFF;
}   

nav ul ul li a:hover 
{
    background: #000000;
    color:#FFFFFF;
}

nav ul ul ul 
{
    position: absolute; left: 100%; top:0;
}

</style>
<div id="navdiv">
<nav>
<ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Tutorials</a>
        <ul>
            <li><a href="#">Photoshop</a></li>
            <li><a href="#">Illustrator</a></li>
            <li><a href="#">Web Design</a>
                <ul>
                    <li><a href="#">HTML</a></li>
                    <li><a href="#">CSS</a></li>
                </ul>
            </li>
        </ul>
    </li>
    <li><a href="#">Articles</a>
        <ul>
            <li><a href="#">Web Design</a></li>
            <li><a href="#">User Experience</a></li>
        </ul>
    </li>
    <li><a href="#">Inspiration</a></li>
</ul>
</nav>
</div>

我想更改子菜单的颜色（即我的示例中的Photoshop，插图画家，网页设计）我可以使用更改背景颜色 CSS

 nav ul ul li a 
 {
    background-color: #FFFFFF;
    color: #FFFFFF;
 }

但我不明白为什么字体颜色没有变化？请帮助我解决问题

Answer 1

尝试将a:visited而不仅仅添加到CSS选择器。

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

Answer 2

只需添加a:visited而不是锚标记

例如：nav ul ul li a, nav ul ul li a:visited

Answer 3

最简单的方法如下：

nav ul ul ul li,
nav ul ul li
{
    background-color: #FFFFFF;
    color: #FFFFFF;
}

尝试此操作会解决您的问题，请分享我可以为您提供更多选择。

CSS样式在子菜单中不起作用

3 个答案: