Возможно Вы часто наблюдали как на разных сайтах при наведении на пункт меню например, становится текст или все что вокруг него другого цвета. Также, возможно появление или исчезновение подчеркивания одновременно с изменением цвета ссылки.

Все это реализовано при помощи использования CSS, а точнее с помощью псевдоклассов - которые необходимы для учета определенных свойств html документа.

Как использовать псевдоклассы в CSS применительно к ссылкам?

В первую очередь необходимо добавить элемент А. Для него пишем наш псевдокласс, потом двоеточие, имя псевдокласса и в самом конце в специальных скобках - необходимый стиль.

А: ИМЯ ПСЕВДОКЛАССА { ... определенный стиль ...}
В CSS для ссылок применяют такие псевдоклассы:
A:link { ... ссылка выглядит согласно настройкам по умолчанию... }
A:active { ... задаются параметры как будет выглядеть ссылка при клике на нее... }
A:visited { ... стиль ссылки после посещения... }
А:hover { ... внешний вид ссылки, при наведении указателя мыши ... }

Оформленная ссылка в CSS

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

a:link {
color: black
}
a:visited {
color: grey;
}
a:hover {
color: red;
}
a:active {
color: green;
}

Можно для каждого случая задать любой цвет на свой вкус или сделать, чтобы ссылка не меняла цвет вообще, указав цвет black (или какой-нибудь другой) во всех случаях.
Запись можно значительно сократить, уменьшив объем CSS документа:

a:link, a:visited, a:hover, a:active {color:black; text-decoration:none;}

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

a {color:black; text-decoration:none;}

Таким образом, для оформления CSS ссылки используется множество способов, что дает возможность менять дизайн сайта под себя.

Следующая страница - Типы селекторов в CSS

Предыдущая - Списки в CSS