Mouse hover efekti nasıl yapılır?

:hover

.button {
  background-color: #007BFF;
  color: #fff;
  padding: 10px 20px;
  border: none;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.button:hover {
  background-color: #0056b3;
}
``` [2](https://blog.pixelfreestudio.com/how-to-create-hover-effects-with-micro-interactions/)

**WordPress'te hover efekti** için ise aşağıdaki eklentiler kullanılabilir:

1. **Flipbox**: Fareyi üzerine getirdiğinizde dönen kutular oluşturur [1](https://www.wpbeginner.com/tr/wp-tutorials/how-to-add-image-hover-effects-in-wordpress/). Flipbox – Awesomes Flip Boxes Image Overlay eklentisini kurup etkinleştirdikten sonra, `Create New` seçeneği ile ilk flipbox'ınızı oluşturabilirsiniz [1](https://www.wpbeginner.com/tr/wp-tutorials/how-to-add-image-hover-effects-in-wordpress/).
2. **Image Hover Effects Ultimate**: Çeşitli özelleştirilebilir efektler sunar [1](https://www.wpbeginner.com/tr/wp-tutorials/how-to-add-image-hover-effects-in-wordpress/). Eklentiyi yükleyip etkinleştirdikten sonra, kontrol panelinden `Image Hover` seçeneğini kullanarak efektleri ekleyebilirsiniz [1](https://www.wpbeginner.com/tr/wp-tutorials/how-to-add-image-hover-effects-in-wordpress/).
Kopyala