Stosowanie pseudo-klas daje możliwość zbudowania logicznej struktury odnośników. Poprzez właściwości takie jak :link, :visited, :hover, :active, :focus możemy nadać formatowanie linkom w zależności od wykonanej akcji.
Pseudo-klasa :link
Dotyczy linków, które nie zostały jeszcze odwiedzone.
W HTML przygotujemy link.
<a href="https://kurshtmlcss.pl">Link do strony</a>
W CSS zdefiniujemy formatowanie dla :link.
a:link { color: blue; }
Pseudo-klasa :visited
Dotyczy linków, które zostały już odwiedzone.
a:visited { color: green; }
Pseudo-klasa :hover
Nadaje formatowanie odnośnikowi, nad którym znajdzie się kursor.
a:hover { color: red; }
Pseudo-klasa :active
Nadaje formatowanie dla linka, na którym w danym momencie wykonywana jest akcja.
a:active { background: orange; }
Pseudo-klasa :focus
Formatuje link, który po wybraniu nadal jest aktywny.
a:focus { color: aqua; }