Почему мой основной класс ссылок (a: links & a: hover) переопределяет мои недавно созданные уникальные классы (#footer_links a: links, #footer_links a: hover) - PullRequest
Новая
       10

Почему мой основной класс ссылок (a: links & a: hover) переопределяет мои недавно созданные уникальные классы (#footer_links a: links, #footer_links a: hover)

0 голосов
/ 10 января 2012

немного сбит с толку и может очень ценить некоторое понимание:

В настоящее время в нашем основном CSS-файле у нас есть все «общие» ссылки, определенные как: 

`a:link {color:#da0000; text-decoration:none;}
a:visited {color: #CA0000;}
a:hover {color: #000000; text-decoration: underline;}
a:active {color:#da0000;}`

Однако, поскольку существуют различные разделы веб-сайта, на которых я хотел бы иметь разные цветные ссылки, я определил другой класс для использования только в нижнем колонтитуле следующим образом: 

`.footer_links {
        font-family: Arial, Helvetica, sans-serif;
    text-decoration: none;
    font-size: 12px;
    color: #FFFFFF;}

.footer_links a:link {
    text-decoration: none;
    color: #FFFFFF;}

.footer_links a:visited {
    text-decoration: none;
    color: #FFFFFF;}

.footer_links a:hover {
    text-decoration: underline;
    color: #000000;}`

Однако, когда я запускаю страницу, эффекты первичной ссылки переопределяют мой класс .footer_links. Это смущает меня, так как в каждой ссылке нижнего колонтитула я определил класс следующим образом: class = "footer_links" - поскольку ссылки определяются отдельным классом, я не уверен, почему его эффекты переопределяются.

Есть мысли по этому поводу?

Ответы [ 2 ]

2 голосов
/ 10 января 2012

Ваши правила неверны, вы вводите некоторые правила для следующей структуры 

<div class="footer_links"><a> ...

если у вас есть html вроде 

<a class="footer_links"> ....

ваш css должен выглядеть как 

a.footer_links {}
a.footer_links:hover {}
0 голосов
/ 10 января 2012

Если я вас правильно понял, вы дали самой ссылки () в нижнем колонтитуле класс footer_links.Правильно?

Если это так, он не может работать, потому что вы указали в своем CSS, что все дочерние элементы footer_links, которые являются Элементом a, имеют поведение.

Измените его на 

.footer_links:visited{
 ...
}

.footer_links:hover{
 ...
}

Если я правильно понял, это должно решить вашу проблему.

...