: hover - Trik CSS | CSS Almanak 2025

Kelas :hoverpseudo di CSS memilih elemen saat kursor mouse berada di atasnya. Ini biasanya dikaitkan dengan elemen link ( ).

a:hover ( color: green; text-decoration: underline overline; )

Jadi, saat tautan seperti ini "diarahkan" (seperti kursor di perangkat dengan mouse):

Go to Google

Ini akan berubah menjadi hijau dan memiliki garis di bawah dan di atasnya.

Di IE 6 dan di bawahnya, :hover dulu hanya berfungsi pada tautan, tetapi di browser yang lebih baru, ini berfungsi pada elemen apa pun. Ini bisa sangat berguna untuk hal-hal seperti menu tarik-turun di mana Anda bisa menunggu :hover item daftar induk dan kemudian mengungkapkan tingkat berikutnya dari menu bersarang. Hati-hati, efek hover harus digabungkan dengan beberapa jenis tindakan, karena itu telah menjadi pola web yang telah lama terbentuk.