KWALIFIKACJA INF3 - CZERWIEC 2022

PYTANIE NR 32.
W arkuszu CSS zapisano przedstawione style. Jeżeli hiperłącze zostanie wybrane, to po powrocie na stronę to hiperłącze będzie w kolorze
Ilustracja przedstawia fragment kodu CSS, który definiuje style dla elementów hiperłączy na stronie internetowej.
A.
B.
C.
D.
Wyjaśnienie poprawnej odpowiedzi:
Hiperłącze po powrocie na stronę ma stan "odwiedzone" (CSS pseudoklasa :visited).
Jeśli w arkuszu stylów dla :visited ustawiono kolor czerwony, to po wejściu w link i powrocie przeglądarka wyświetli go jako czerwony (o ile nie nadpisze go inna reguła o wyższym priorytecie).

Pełne wyjaśnienie:

Po kliknięciu hiperłącza i powrocie na stronę przeglądarka traktuje taki odnośnik jako odwiedzony. W CSS odpowiada za to pseudoklasa :visited stosowana zwykle do selektora a:visited. Dlatego kolor widoczny "po powrocie" wynika z reguły przypisanej właśnie do stanu odwiedzonego.

Odpowiedź "czerwonym." jest poprawna, jeżeli w pokazanych stylach zdefiniowano kolor czerwony dla linku odwiedzonego (np. reguła ustawiająca color na czerwony dla :visited). W praktyce ważne jest też, aby pamiętać o kaskadowości: gdy istnieje kilka reguł pasujących do tego samego elementu, przeglądarka wybiera tę o wyższej specyficzności lub – przy równej specyficzności – tę zapisaną później.

Dlaczego pozostałe kolory mogą być błędne?

  • "zielonym." – często odpowiada stanowi :hover (najechanie myszą) albo innemu selektorowi, ale nie opisuje typowego stanu "po powrocie", jeśli nie jest przypisany do :visited.
  • "brązowym." – mógłby dotyczyć np. linku nieodwiedzonego (:link) lub elementu w innym kontekście (np. menu), lecz nie będzie właściwy dla "odwiedzonego", jeżeli CSS definiuje inny kolor dla :visited.
  • "żółtym." – bywa kojarzony ze stanem aktywnym :active (w trakcie kliknięcia) lub z tłem, a nie z kolorem tekstu po odwiedzeniu. Jeśli nie jest przypisany do :visited, nie odpowie na pytanie.

Wskazówka egzaminacyjna: zwracaj uwagę na słowa sugerujące stan linku. "Po powrocie na stronę" zwykle oznacza :visited, "podczas kliknięcia" – :active, "po najechaniu" – :hover, a "gdy element ma fokus" – :focus.

Dodatkowe pytania

Dodatkowe pytania (FAQ):
:visited dotyczy hiperłączy, które użytkownik już odwiedził (przeglądarka ma je w historii). Reguły typu a:visited pozwalają zmienić np. kolor tekstu takiego linku, aby odróżnić go od linków nieodwiedzonych.
Najczęściej wskazówką są sformułowania typu "po powrocie na stronę" albo "po wejściu w link". To opisuje stan po odwiedzeniu adresu, czyli :visited, a nie chwilowy stan kliknięcia (:active) czy najechania myszą (:hover).
:active działa tylko w trakcie naciskania (moment kliknięcia), a :focus dotyczy elementu, który ma fokus (np. po nawigacji klawiaturą). "Po powrocie na stronę" oznacza trwałą zmianę wynikającą z historii odwiedzin, czyli :visited.
Klasyczna zasada to kolejność reguł: :link, :visited, :hover, :active (LVHA). Chodzi o to, aby bardziej "dynamiczne" stany (hover/active) nie były przypadkowo nadpisane przez wcześniejsze reguły o tej samej specyficzności.
Nie w pełni. Ze względów prywatności przeglądarki ograniczają, które właściwości mogą się różnić między :link i :visited. Najczęściej bezpiecznie działa zmiana koloru, ale nie wszystkie efekty (np. niektóre obliczenia i odczyty) są możliwe.
W narzędziach deweloperskich (zakładka "Elements/Inspector") zaznacz link i sprawdź panel "Styles/Computed". Zobaczysz, która reguła ustawia color oraz czy pochodzi z selektora a:visited. To pomaga wykryć nadpisanie przez inną regułę.
Kolor może być nadpisany przez regułę o większej specyficzności (np. .menu a:visited) albo przez regułę zapisaną później przy tej samej specyficzności. Wpływ ma też !important, które może wymusić priorytet, choć nie jest zalecane.
Najczęstsze błędy to mylenie "odwiedzonego" z "aktywnym", ignorowanie kaskadowości (kolejności w arkuszu), oraz nieuwzględnianie, że pytanie dotyczy koloru po powrocie, a nie w trakcie najechania myszą. Warto kojarzyć słowa-klucze ze stanami.
W SPA (Single Page Application) link może prowadzić do innego widoku bez pełnego przeładowania strony, ale jeśli jest to normalny adres URL, przeglądarka nadal może oznaczyć go jako odwiedzony. Jeśli nawigacja nie zmienia URL lub używa nietypowych mechanizmów, efekt :visited może być mniej przewidywalny.
Przećwicz zestaw reguł dla :link, :visited, :hover, :active i sprawdzaj efekt w przeglądarce. Ucz się też diagnozowania w DevTools: z jakiego selektora pochodzi kolor i czy nie został nadpisany. To szybki sposób na pewne odpowiedzi na egzaminie.
info

Statystycznie 55% uczniów zna prawidłową odpowiedź. średnie

Źródła:

  • MDN Web Docs: ":visited" (CSS) — https://developer.mozilla.org/en-US/docs/Web/CSS/:visited (dostęp: 2026-02-27)
  • MDN Web Docs: "Styling links" — https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Styling_links (dostęp: 2026-02-27)
  • W3C Recommendation: Selectors Level 3, rozdział o pseudoklasach (w tym :visited) — https://www.w3.org/TR/selectors-3/ (dostęp: 2026-02-27)

Materiały:

  • Dokumentacja MDN: pseudoklasa :visited
  • Dokumentacja MDN: stylowanie linków i kolejność LVHA
  • Specyfikacja W3C Selectors Level 3/4 (pseudoklasy)

Aktualizacja pytania: 31.03.2026



Aktualizacja pytania: 31.03.2026
📡 Brak połączenia internetowego