html - 导航菜单停留在 IE 中

Question

我正在为企业制作一个非常简单的网站(而且我是这个领域的新手)，我的菜单在除 IE 之外的所有浏览器中都可以正常工作，当将鼠标悬停在链接上时，它会保持活跃的外观。我正在使用 HTML5 和 CSS3。

HTML

    <nav><ul>
        <li class="active"><a href="index.html">Home</a></li>
        <li><a href="corporate.html">Corporate Info</a></li>
        <li><a href="employment.html">Employment</a></li>
        <li><a href="#">
        Login</a></li>
        <li><a href="#">Forums</a></li>
    </ul></nav>

CSS

    .main-header nav {
    background-color: #DCDCDC;
    height: 40px;
}

.main-header nav ul{
    list-style: none;
    margin: 0 auto;
}

.main-header nav ul li {
    float: left;
    display: inline;
}

.main-header nav a:link, .main-header nav a:visited {
    color: #023878;
    display: inline-block;
    padding: 10px 25px;
    height: 20px;
}

.main-header nav a:hover, .main-header nav a:active,
.main-header nav .active a:link, .main-header a:visited {
    background-color: #B6C2C7;
    color: #023878;
    text-shadow: none;
}

.main-header nav ul li a {
    border-radius: 5px;
}

Answer 1

您指的是主页链接吗？如果是这样，应用于 li 元素的 active 类就是这样做的。您可以添加事件类以显示您当前所在的页面。尝试删除 active 类，看看是否符合您的要求。因此，更改 HTML 中的这一行:

<li class="active"><a href="index.html">Home</a></li>

为此:

<li><a href="index.html">Home</a></li>