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ę
Pytanie z egzaminu CKE, styczeń 2017 (arkusz E.14-X-17.01).
Pseudoklasa :hover opisuje stan elementu, nad którym znajduje się wskaźnik myszy. Reguła p:hover { color: red; } sprawia, że akapit zmienia kolor czcionki dokładnie wtedy, gdy najedzie się na niego kursorem, i wraca do poprzedniego wyglądu po zjechaniu. Działa dla dowolnego elementu, nie tylko dla odnośników.
Najczęściej stosuje się ją w menu i przyciskach, np. a:hover { text-decoration: underline; }. Przy odnośnikach obowiązuje kolejność reguł LVHA: :link, :visited, :hover, :active, bo późniejsza reguła o tej samej szczegółowości nadpisuje wcześniejszą. Na ekranach dotykowych stan hover praktycznie nie występuje, więc ważne informacje nie powinny pojawiać się tylko po najechaniu.
Każda z błędnych odpowiedzi opisuje inny moment interakcji. :active obowiązuje tylko w chwili kliknięcia, czyli gdy przycisk myszy jest wciśnięty nad elementem. Zmiana koloru byłaby widoczna przez ułamek sekundy, a nie przez cały czas trzymania kursora nad elementem.
:visited dotyczy wyłącznie odnośników do stron, które użytkownik już odwiedził. Przeglądarka pozwala w niej zmienić głównie kolor, ale reguła nie ma związku z ruchem kursora i nie działa dla zwykłych akapitów czy nagłówków.
Pseudoklasa :coursor w ogóle nie istnieje. Nazwa jest zniekształceniem słowa cursor, a właściwość cursor zmienia tylko kształt wskaźnika myszy. Stan najechania kursorem nazywa się :hover.
Pozostałe pseudoklasy działają tylko w swoich, ściśle określonych sytuacjach.
Pseudoklasy zapisuje się z dwukropkiem tuż po selektorze, bez spacji. Zapis p :hover ze spacją oznaczałby element w stanie hover wewnątrz akapitu.