0

我为导航栏设置样式的方式如下:

nav a:link,a:visited {
    display:block;
    width: 125px;
    color:#000000;
    background-color:#FFFFFF;
    text-decoration:none;
    font-family: Arial,Helvetica,sans-serif;
    font-variant:small-caps;
    padding: 5px;
    font-size: 18px;
}

我的其余链接的样式如下:

footer a:link {
    color:#7A7A7A;
}

footer a:visited {
    color:#7A7A7A;
} 

footer a:hover {
    color:#383838;
}   

footer a:active {
    color:#000000;
} 

问题是 Opera 无法识别 a:link,a:visited 之前的 #nav 或 #footer,因此,我页面上的每个链接看起来都像 Opera 中的导航栏。谁能想到解决这个问题?

HTML

<ul id="nav">
    <li>
        <a href="#home">Home</a>
    </li>

    <li>
        <a href="#news">About Us</a>
    </li>

    <li>
        <a href="#contact">Portfolio</a>
    </li>

    <li>
        <a href="#about">Services</a>
    </li>

    <li>
        <a href="#about">Contact Us</a>
    </li>
</ul>

这是被覆盖的 HTML:

<div id="footer">
    Copyright 2013, <a href="http:">Link 1 </a> and <a href="http:">Link 2 </a>
</div>
4

3 回答 3

2

您的导航链接的第二个选择器不太正确,应该是:

nav a:link,
nav a:visited {
    // styles
}

而不是nav a:link, a:visited这样,样式会应用于每个访问过的锚点。

也像其他答案中提到的那样,由于您已经发布了 HTML,因此您必须使用#navor选择索引 (id) 元素#footer

于 2013-04-10T12:40:45.837 回答
1

您正在尝试定位一个 ID,您的 CSS 选择器应该是#nav并且#footer

例如

#footer {
  blah
}
#nav {
  blah
}
于 2013-04-10T12:51:45.950 回答
0

正如Simons的回答中提到的,它是需要nav添加的第二个选择器,nav a:visited而不是a:visited.

这是一个工作示例(在 Win7 上的 Opera 12 和 Chrome 26 中测试)

也从更改nav#nav(页脚相同)以使其与您的 html 一起使用

于 2013-04-10T12:53:39.157 回答