如何更改此css代码中的文本颜色？

Question

我有一个带有一些菜单项的简单标题：

<div id="header">
<ul id="menu">
<li class="item">
<a class='loginlinks' href='/signup'>Sign Up</a>
<a class='loginlinks' href='/login'>Log In</a>
</li>
</ul>
</div>

我正在尝试使用下面的代码将注册和登录文本颜色更改为白色但它没有效果...文本继续继承红色的全局文本颜色。

.loginlinks a {
color: white;
}

我在这里做错了什么？

编辑：我看到了我的错误，但即使将css更改为 a.loginlinks 也无法解决问题。

已解决所有正确的答案，我选择了对firebug的引用，因为这最终帮助我确定了问题。谢谢大家。

Answer 1

在a类的元素中说“loginlinks标记”。您想要“具有a类”的loginlinks代码：

a.loginlinks {
    color: white;
}

Answer 2

最佳做法是使用颜色代码（十六进制），而不是名称。

a.loginlinks {
color:#FFFFFF;
}

因为现在不推荐按颜色名称分配颜色。

working DEMO

注意：如果您仍然遇到问题，请尝试使用firebug进行调试，可能是某些其他属性已被继承

参考：http://www.w3.org/TR/WCAG10-CSS-TECHS/#style-color-contrast

Answer 3

试试这个：）

a.loginlinks {
    color: white;
}

Answer 4

那是因为你的DOM没有。loginlinks a。

换句话说，请再次检查，然后您会看到课程.loginlinks已附加到a。

所以，为了让它工作，只需使用这个CSS：

a.loginlinks {
   color: white;
}

编辑：阅读OP编辑后，解决方案取决于“全局”a如何定义。

如果OP“绝望”他/她可以使用!important属性，则会覆盖所有其他定义。

像这样：

a.loginlinks {
    color: white !important;
}

Answer 5

将CSS更改为

a.loginlinks {
color: white;
}

Answer 6

如果我正确地假设您的情况，那么就会像这样解决

body {background:red;color:red}
#header a {color:yellow}
#header a.loginlinks {color: white }

请参阅此处示例http://jsfiddle.net/pyNEe/