Pseudoklasy CSS :link i :visited

Pseudoklasy CSS :link i :visited

Pseudoklasy :link i :visited służą do ustawiania wyglądu hiperłączy w zależności od tego, czy użytkownik już je odwiedził.

:link

Pseudoklasa :link oznacza link nieodwiedzony, czyli taki, którego adres nie znajduje się jeszcze w historii przeglądarki użytkownika.

a:link {
  color: yellow;
}

Ten zapis ustawia kolor żółty dla nieodwiedzonych linków.

:visited

Pseudoklasa :visited oznacza link odwiedzony, czyli taki, który użytkownik wcześniej otworzył.

a:visited {
  color: green;
}

Ten zapis ustawia kolor zielony dla odwiedzonych linków.

Przykład z pytania egzaminacyjnego

Aby linki nieodwiedzone były żółte, a odwiedzone zielone, należy zapisać:

a:link {
  color: yellow;
}

a:visited {
  color: green;
}

Kolejność pseudoklas linków

W praktyce często stosuje się kolejność zgodną z zasadą LVHA:

1. :link — link nieodwiedzony,
2. :visited — link odwiedzony,
3. :hover — link po najechaniu kursorem,
4. :active — link w momencie kliknięcia.

Przykład:

a:link { color: yellow; }
a:visited { color: green; }
a:hover { color: red; }
a:active { color: blue; }

W pytaniach egzaminacyjnych trzeba szczególnie odróżniać :link od :visited. :hover nie oznacza linku odwiedzonego, tylko stan po najechaniu kursorem.