Станы спасылаў у CSS

Я думаю, што вы, наведваючы розныя сайты ў інтэрнэце, звярталі ўвагу на тое, што спасылкі звычайна рэагуюць на навядзенне мышой на іх. Такога эфекту можна дабіцца, задаючы паводзіны спасылак у розных станах.

Напрыклад, вось так - a:hover - мы зловім стан, калі на спасылку навялі курсор мышы. У гэты момант мы можам, напрыклад, памяняць колер спасылкі альбо прыбраць/дадаць ёй падкрэсленне. Канструкцыя :hover называецца псеўдакласам. Псеўдакласы дазваляюць лавіць розныя станы элементаў.

Акрамя :hover ёсць яшчэ псеўдакласы :link, якія лавяць не наведаную спасылку, і :visited, якія лавяць наведаную спасылку. На некаторых сайтах з іх дапамогай паказваюць карыстачам, дзе яны былі, а дзе - не. Ёсць яшчэ і псеўдаклас :active, які лавіць наступны стан: на элемент націснулі мышой, але яшчэ не адпусцілі.

У наступным прыкладзе для спасылкі ў стане :hover прыбіраецца падкрэсленне, у стане :link задаецца чырвоны колер, у стане :visited - зялёны, у :active - блакітны. У выніку атрымаецца, што ў пачатку спасылка будзе чырвонага колеру, пасля націску на яе - зялёнага, калі націснуць на яе мышой і не адпусціць - блакітнага, а калі навясці мышой - стане непадкрэсленай:

cssa:link {
  color: red;
}
a:visited {
  color: green;
}
a:hover {
  text-decoration: none;
}
a:active {
  color: blue;
}

html<a href="#">link</a>

Результат: