Cara menggunakan hover dalam css

Dalam CSS, :hover ialah pemilih kelas pseudo yang digunakan untuk memilih elemen yang dituding oleh penunjuk tetikus. Anda boleh menggunakan :hover untuk menggunakan beberapa perubahan gaya apabila pengguna menuding pada elemen.

Berikut ialah contoh mudah cara menggunakan :hover untuk menukar warna pautan:

a {  
  color: blue;  
}  
  
a:hover {  
  color: red;  
}

Dalam contoh ini, apabila pengguna menuding pada pautan, warna pautan akan bertukar kepada merah. Apabila tiada tetikus, warna pautan adalah biru.

Selain menukar warna, anda juga boleh menggunakan :hover untuk menggunakan perubahan gaya lain, seperti warna latar belakang, gaya jidar, saiz fon dan banyak lagi. Berikut ialah contoh yang lebih kompleks:

button {  
  background-color: lightgray;  
  border: none;  
  padding: 10px 20px;  
  font-size: 16px;  
}  
  
button:hover {  
  background-color: gray;  
  color: white;  
  border: 2px solid white;  
  font-size: 18px;  
}

Dalam contoh ini, apabila pengguna menuding pada butang, warna latar belakang butang akan bertukar kepada kelabu, warna teks akan bertukar kepada putih, dan jidar akan bertukar kepada putih, Dan saiz fon akan ditingkatkan kepada 18 piksel.

Atas ialah kandungan terperinci Cara menggunakan hover dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!