Изменение стиля ссылки, только для определенного класса

Question

Я хочу изменить стиль ссылок для некоторых из моих ссылок, например:

a:hover
{
    /* These links will be blue when hovered-over */
    background-color: #3366FF;
}

Однако я хочу, чтобы это действовало только в моей панели навигации, а не для обычных ссылок.

Я пробовал варианты этого:

#navbar a:hover
{
    /* These links will be blue when hovered-over */
    background-color: #3366FF;
}

С намеченным значением "это относится только к ссылкам с <div id="navbar">"
Но это не сработало.

Как установить стиль только для определенных ссылок, определенных class или id их контейнера?

Answer 1

Мне кажется, у Робусто правильная точка с используемым цветом.

Другой метод - дать ссылкам собственный класс, например:

CSS

a.navlink:visited 
a.navlink:hover
{
    background-color: #3366FF; 
}

HTML

<a href="index.html" class="navlink">Home</a>

Answer 2

Возможно, ваши проверенные ссылки - это посещенные ссылки. Я предпочитаю:

#navbar a:hover,
#navbar a:visited
{
    background-color: #3366FF;
}

Answer 3

Я думаю, что вы можете использовать здесь свойство "color" вместо "background-color".

Если случайно вы действительно делаете хотите изменить цвет фона, помните, что ссылки отображаются встроенными и не имеют большого удобного прямоугольника вокруг них, поэтому в зависимости от цвета фона контейнера это может не быть заметным (Это, вероятно, не тот случай, но я добавил это, если ваши ссылки очень маленькие.)

Наконец, поскольку синий цвет близок к цвету ссылки по умолчанию, рассмотрите возможность тестирования экзотического цвета (например, красного), чтобы выяснить, связана ли проблема с вашим CSS или выбранным цветом.