Kwalifikacje w Zawodzie - Testy zawodowe online | Egzaminy Zawodowe

KWALIFIKACJA INF3 - STYCZEŃ 2017



PYTANIE NR 9.
W języku CSS aby sformatować dowolny element języka HTML w ten sposób, że po najechaniu na niego kursorem zmienia on kolor czcionki, należy zastosować pseudoklasę
A.
B.
C.
D.
Wyjaśnienie poprawnej odpowiedzi:
Pseudoklasa :hover w CSS opisuje stan elementu, gdy wskaźnik myszy znajduje się nad nim. Aby po najechaniu zmienić kolor tekstu, łączy się selektor z :hover i ustawia właściwość color. Pozostałe pseudoklasy dotyczą innych stanów, np. kliknięcia lub odwiedzenia linku.

Pełne wyjaśnienie:

Pytanie dotyczy pseudoklas CSS, czyli selektorów opisujących stan elementu (zależny np. od działań użytkownika), a nie jego typu czy klasy. Stan "po najechaniu kursorem" to klasyczny przypadek użycia pseudoklasy :hover.

Dlaczego :hover jest poprawne?
Gdy użytkownik najedzie wskaźnikiem myszy na element, przeglądarka traktuje go jako znajdujący się w stanie hover. Wtedy reguła CSS z selektorem zakończonym :hover zaczyna obowiązywać. Przykładowo: ustawienie color w tym stanie zmieni kolor czcionki właśnie podczas najechania.

  • :hover – dotyczy najechania wskaźnikiem (typowe efekty: zmiana koloru, podświetlenie, podkreślenie).
  • :active – dotyczy elementu w trakcie aktywacji (zwykle w momencie kliknięcia i trzymania przycisku myszy). To inny moment interakcji niż samo najechanie.
  • :visited – działa dla linków, które zostały odwiedzone (dotyczy tylko odnośników, nie "dowolnego elementu"). Nie opisuje najechania, tylko historię odwiedzin.
  • :coursor – nie jest standardową pseudoklasą CSS, więc nie może być poprawnym wyborem.

Wskazówka egzaminacyjna: jeśli w treści widzisz "po najechaniu", myśl o hover. Jeśli jest "po kliknięciu / w czasie kliknięcia" – rozważ active. Jeśli mowa o stanie linku po odwiedzeniu – to visited.

Dodatkowe pytania

Dodatkowe pytania (FAQ):
Co to jest pseudoklasa :hover w CSS?
Pseudoklasa :hover opisuje stan elementu, gdy wskaźnik myszy znajduje się nad nim. Używa się jej do efektów interaktywnych, np. zmiany koloru tekstu lub tła po najechaniu na link, przycisk albo element menu.
Jak zmienić kolor tekstu po najechaniu kursorem w CSS?
Dodaj regułę dla selektora ze stanem :hover i ustaw właściwość color. Przykład idei: element w normalnym stanie ma jeden kolor, a w stanie hover inny. Działa bez JavaScript.
Dlaczego :active to nie to samo co :hover?
:hover działa przy samym najechaniu wskaźnikiem. :active dotyczy momentu aktywacji, zwykle gdy użytkownik klika i przytrzymuje przycisk myszy na elemencie. To inny etap interakcji, więc daje inny efekt w UI.
Co oznacza pseudoklasa :visited i kiedy działa?
:visited odnosi się do odnośników, które zostały wcześniej odwiedzone (przeglądarka ma to w historii). Nie działa dla dowolnych elementów, tylko dla linków. Nie opisuje najechania kursorem, lecz stan "odwiedzone".
Czy :hover działa na urządzeniach dotykowych?
Na urządzeniach dotykowych zachowanie :hover może być inne niż na komputerze z myszą, bo nie ma stałego "najechania". Często efekt pojawia się przy dotknięciu lub wcale. W projektach mobilnych warto testować i uzupełniać style np. o :focus.
Jakie inne pseudoklasy są ważne na egzaminie z CSS?
Poza :hover często pojawiają się :active, :focus, :visited, :first-child czy :nth-child(). Warto kojarzyć, czy pseudoklasa dotyczy interakcji użytkownika, struktury dokumentu, czy stanu linku.
Jak odróżnić pseudoklasę od pseudoelementu w CSS?
Pseudoklasa (np. :hover) opisuje stan lub relację elementu. Pseudoelement (np. ::before) tworzy "wirtualną" część elementu do stylowania. Na egzaminie łatwo je pomylić, bo wyglądają podobnie w zapisie.
Czy można używać :hover dla dowolnego elementu HTML?
W praktyce :hover można stosować do wielu elementów, ale najlepszy sens ma tam, gdzie użytkownik może wskazać element (np. linki, przyciski, elementy menu). Kluczowe jest to, że stan zależy od wskaźnika (myszy/trackpada).
Jakie błędy najczęściej robi się przy :hover na egzaminie?
Typowe pomyłki to wybór :active zamiast :hover, mylenie :visited z efektem zmiany koloru, oraz wpisywanie nieistniejących pseudoklas. Warto zapamiętać: "najechanie" = hover, "kliknięcie" = active.
Jak przygotować się do pytań o pseudoklasy CSS na INF.3?
Najlepiej przećwiczyć krótkie przykłady: osobno dla :hover, :active, :focus i :visited. Ucz się poprzez skojarzenia stanów z działaniem użytkownika oraz testuj w przeglądarce, bo wtedy łatwiej zapamiętać różnice.
info

To pytanie poprawnie rozwiązuje 74% zdających egzamin. średnio łatwe

Specjaliści zwracają uwagę: "Pseudoklasa :hover w CSS opisuje stan elementu, gdy wskaźnik myszy znajduje się nad nim."

Źródła:

  • MDN Web Docs: "Pseudo-classes" (CSS) – https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes (dostęp: 2026-02-18)
  • MDN Web Docs: ":hover" – https://developer.mozilla.org/en-US/docs/Web/CSS/:hover (dostęp: 2026-02-18)
  • MDN Web Docs: ":active" – https://developer.mozilla.org/en-US/docs/Web/CSS/:active (dostęp: 2026-02-18)

Materiały:

  • Dokumentacja MDN o pseudoklasach CSS i selektorach
  • Ćwiczenia z tworzenia stylów dla stanów :hover/:active/:focus
  • Materiały kursowe z podstaw CSS (selektory, kaskadowość, stany interakcji)
Zobacz też:

Aktualizacja pytania: 31.03.2026



Aktualizacja pytania: 31.03.2026
📡 Brak połączenia internetowego