我的导航栏CSS覆盖了Opera上的其他链接CSS [英] My Navigation Bar CSS is overwriting my other links CSS on Opera

查看:81
本文介绍了我的导航栏CSS覆盖了Opera上的其他链接CSS的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

The way I have styled my navigation bar follows as:

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中的导航栏.谁能想到解决方案?

The problem is that Opera cannot recognize the #nav or #footer before the a:link,a:visited and as such, every link on my page looks like the navigation bar in Opera. Can anyone think of a fix for this?

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:

And this is the HTML that is being overwritten:

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

推荐答案

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

Your second selector for the navigation links isn't quite correct, should be:

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

不仅是nav a:link, a:visited,还可以将样式应用于每个访问的锚点.

instead of just nav a:link, a:visited, like this the styles get applied to each visited anchor.

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

Also like mentioned in other answers, since you've posted your HTML, you must select indexed (id) elements with #nav or #footer.

这篇关于我的导航栏CSS覆盖了Opera上的其他链接CSS的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆