В CSS можно изменить любое свойство ссылок (цвет, шрифт, цвет фона). Также для ссылок можно настроить стили, в зависимости от их состояния:
a:link — не посещенная ссылка;
a:visited — посещенная ссылка;
a:hover — ссылка, над которой находится курсор мыши;
a:active — ссылка в момент щелчка мыши.
Пример:
1
a:link {font-size:12px; color:#ff0000;}
2
a:visited {font-size:12px; color:#00ff00;}
3
a:hover {font-size:12px; color:#ff00ff;}
4
a:active {font-size:12px; color:#0000ff;}
При формировании стилей ссылок следует соблюдать правила:
1. «a:hover» должен определяться только после «a:link» и «a:visited»;
2. «a:active» должен определяться после «a:hover».
При оформлении текста ссылки используют также свойства:
1. text-decoration — задает подчеркивание текста ссылки.
Атрибуты:
blink — устанавливает мигающий текст;
line-through — создает перечеркнутый текст;
overline — линия проходит над текстом;
underline — устанавливает подчеркнутый текст;
none — отменяет все заданные по умолчанию эффекты;
inherit — значение наследуется у родителя.
Пример:
1
a:link {text-decoration:none;}
2
a:visited {text-decoration:none;}
3
a:hover {text-decoration:underline;}
4
a:active {text-decoration:underline;}
2. background-color — задает цвет фона ссылок.
Пример:
1
a:link {background-color:#b2аа99;}
2
a:visited {background-color:#ffff85;}
3
a:hover {background-color:#gg704d;}
4
a:active {background-color:#ff7ddd;}
Таким образом, мы рассмотрели стили ссылок в CSS. При создании сайта знать, как работать со ссылками просто необходимо. Стили CSS позволяют предать ссылкам определенное визуальное отображение, что также весьма полезно.