Objašnjeno CSS Birač pokazivača (s primjerom)

CSS :hoverselektor jedna je od mnogih pseudo-klasa koje se koriste za oblikovanje elemenata. :hoverkoristi se za odabir elemenata nad kojima korisnici prelaze kursorom ili mišem. Može se koristiti na svim elementima, ne samo na vezama.

Kada se koristi za stil veza, :hoverčesto je u paru s :link, :visitedi :activeselektora koji stil unvisited, posjetili i aktivne veze, respektivno.

Ako su :linki :visitedpravila u definiciji CSS-a, :hovertrebali bi pasti za njima. Inače, stilovi u :hoverpravilu neće se primijeniti na odabrani element.

Sintaksa:

a:hover { /* CSS declarations */ }

Birač lebdenja primjenjuje stilove predviđene pravilom samo kada element uđe u stanje lebdenja. To je obično kada korisnik lebdi iznad elementa mišem.

button { color: white; background-color: green; } button:hover { background-color: white; border: 2px solid green; color: green; }

U gornjem primjeru uobičajeni stil gumba je bijeli tekst na zelenom gumbu. Kad korisnik mišem zadrži pokazivač iznad gumba, :hoverpostat će aktivno pravilo s biračem i promijenit će se stil gumba.

Imajte na umu da to :hovermože biti problematično na dodirnim zaslonima - različite implementacije hardvera i mobilnog preglednika mogu u nekim slučajevima pokrenuti pseudo-klasu, a u drugima ne. Obavezno temeljito testirajte elemente sa :hoveršto više različitih mobilnih preglednika i uređaja.