A CSS :hoverválasztó egyike a sok álosztálynak, amelyeket az elemek stílusához szoktak használni. :hoverolyan elemek kiválasztására szolgál, amelyek fölé a felhasználók az egérrel vagy az egérrel viselik az egeret. Minden elemen használható, nem csak linkeken.
Ha használt stílus linkek, :hovergyakran párosul a :link, :visitedés :activeszelektor melyik stílus látogatott, látogatott, és az aktív linkek, ill.
Ha :linkés :visitedszabályok a CSS definíció :hoverkell esnie utánuk. Ellenkező esetben a :hoverszabály stílusai nem lesznek alkalmazva a kijelölt elemre.
Szintaxis:
a:hover { /* CSS declarations */ }A lebegésválasztó csak akkor alkalmazza a szabályban megadott stílusokat, amikor egy elem belép a lebegési állapotba. Ez általában akkor történik, amikor a felhasználó az egérrel az elem felett lebeg.
button { color: white; background-color: green; } button:hover { background-color: white; border: 2px solid green; color: green; }A fenti példában a gomb szokásos stílusa a zöld gombon lévő fehér szöveg. Amikor a felhasználó az egérrel a gomb fölé viszi az egérmutatót, a :hoverválasztóval ellátott szabály aktívvá válik, és a gomb stílusa megváltozik.
Ne feledje, hogy :hoverproblémás lehet az érintőképernyőkön - a különböző hardveres és mobil böngésző-megvalósítások miatt az álosztály egyes esetekben kiváltható, másokban nem. Ügyeljen arra, hogy alaposan tesztelje az elemeket a :hoverlehető legkülönbözőbb mobilböngészőkkel és eszközökkel.