Переопределение: посещенные переопределения: link: hover: active

Ответ 1

Я считаю, что это связано с CSS приоритетом.

Поскольку #special - это идентификатор, он затмевает любой применяемый стиль на уровне элемента. (Это можно проверить в Firefox Firebug/Chrome Inspector и как унаследованные таблицы стилей полностью написаны стилем ID).

Хотя, учитывая, что нет "настоящего стиля", применяемого для: active,: visited и т.д. Было бы разумно, что эти стили все равно будут не затронуты. Тем не менее, внесение следующего изменения в ваш наведение, кажется, оттолкнуть его обратно на передачу:

a:hover { color: green !important; }

Ответ 2

Почему это происходит?

Стили для псевдокласса :link применяются ко всем состояниям ссылок, поэтому он включает в себя :hover, :visited и :active

Это то, что я наблюдал с тех пор, как начал использовать CSS несколько лет назад. Я не знаю, как это работает, но я видел, как он работал и ожидал, что он сработает.

Итак, когда вы устанавливаете стиль для #special:link, этот стиль также применяется к #special:hover, #special:visited и #special:active

Обратите внимание, что использование идентификатора здесь не сильно меняется.
Если вы попробуете его с помощью CSS ниже, у вас будут две ссылки розовые... даже для :hover state

a:link { color: blue }
a:visited { color: red }
a:hover { color: green }
a:active { color: black }
a:link { color: pink }

Как я могу его исправить?

Вы можете использовать !important, как было предложено Брэдом, или установить стили разных состояний для #special вместе с регулярными ссылками.

a:link { color: blue }
#special:link { color: pink }
a:visited, #special:visited { color: red }
a:hover, #special:hover { color: green }
a:active, #special:active { color: black }

Ответ 3

Его отягчающие... и порядок имеют значение здесь:

a:hover{
color:green;
}

a:visited{
color:red;
}

Это означает, что невидимые ссылки станут зелеными, когда вы наведите курсор мыши на них, а посещаемые ссылки останутся красными, когда вы на них наведите указатель.

Переключатель:

a:visited{
color:red;
}

a:hover{
color:green;
}

Это означает, что и посещаемые ссылки, и невидимые ссылки станут зелеными, когда вы наведете их. Я ненавижу, что порядок этих свойств изменяет поведение; стиль зависания должен действовать независимо.

a:link{
    color:blue;
}

a.one:hover{
    color:green;
}
a.one:visited{
    color:red;
}

a.two:visited{
    color:red;
}
a.two:hover{
    color:green;
}

<a href=#ddd class=one>One (wont change color on hover when visited)</a> |
<a href=#ddd class=two>Two (always turns green on hover)</a>

Ответ 4

Вот еще один быстрый способ:

Вы можете использовать :not(:hover).

#special:link:not(:hover) { color: pink }

DEMO

Ответ 5

Нет, он не будет использовать другие цвета из-за своего идентификатора, в таком случае вы должны добавить остальные действия и цвета в ID.

Например, ссылка, которую у вас есть, "специальная", когда будет сказано.

Хорошо, я 'a'... link... и мой идентификатор... специальный, поэтому я сохраню специальные параметры.

Вот почему это не изменится.

Надеюсь, что это поможет,