html - CSS - Different classes but link color doesn't change

Question

I have two kind of links, the one should be white, the other links should be black. Therefore I added a class to the first navigation

<nav class="navigation">
        <a href="#about" onclick="openAbout()" class="nav">Über mich</a>
</nav>

In CSS I now did this

.navigation
{
    float:right;
    margin-top:15pt;

}

.navigation a, a:visited, a:active{
    color:white;
    text-decoration:none;
    margin-left:20px;
}

.navigation a:hover
{
    color:white;
    text-decoration:underline;
    text-decoration-color: red;
    margin-left:20px;
}

Now I have other links that should be displayed in black and not in white

<b>Source Code runterladen:</b> <a href="http://theo-tzaferis.de/projectCode/assmash.zip" class="sourceCode">Link</a>

Note that this link IS NOT inside a navigation tag. So I did this in CSS

.sourceCode a, .sourceCode a:hover, .sourceCode a:visited, .sourceCode a:active
{
    color:black;
}

But the problem is that both links are either white or black. I want them to be different, but it doesn't work and I don't really know why.

Here's the complete source code

http://jsfiddle.net/bVN9X/

Note that the Links in the header are white, but also the links that should be under "Projekte" are white, too. I don't really know why.

Answer 1

您的选择器必须以这种方式定义：

a.sourceCode

因为您现在拥有它的方式是a在带有类的东西中寻找标签sourceCode。

Answer 2

你应该改变你的css，如下所示：

a.sourceCode, a.sourceCode:hover, a.sourceCode:visited, a.sourceCode:active
{
    color:black;
}