2

每当我将鼠标悬停在当前选定的菜单项上时，它的颜色都会发生变化，我想防止这种情况发生。这是我的代码。

<html>
    <head>
        <title> Another Page </title>
        <link rel="stylesheet" href="style4.css" type="text/css" />
    <head>

    <body>

        <div id="title">

            <ul>
                <li class="current"><a href="home.html">Home</a></li>
                <li><a href="content.html">Content</a></li>
                <li><a href="search.html">Search</a></li>
            </ul>

            <div id="clear">
            </div>

        </div>

        <div id="wrapper">

            <div id="header">


            </div>

        </div>

    </body>


</html>

这是CSS

body
{
    padding: 0;
    margin: 0;
    background-color: rgb(24,205,20);
}

h1,h2,h3
{
    padding: 0;
    margin: 0;
}

p
{
    padding: 0;
    margin: 0;
}

.current
{
    background-color: black;

}


#title
{
    background-color: orange;   
}

#title ul
{

    list-style: none;
    padding: 0;
    margin: 0;
}

#title li
{
    float: left;
}

#title a
{
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    display: block;
    width: 120px;
    font-weight: bold;
    color: #ffffff;
    padding: 4px;
}

#title a:hover
{
    background-color: rgb(180,138,18);
}

#clear
{
    clear: both;
}

需要一些紧急建议来解决这个问题。

谢谢你。

4

1 回答 1

1

将此行添加到 CSS 文件的末尾：

#title .current a:hover {
        background-color: inherit;
}
于 2012-09-15T06:14:24.613 回答