- Katılım
- 20 Ağu 2012
- Mesajlar
- 32
Merhaba arkadaşlar. Foruma katılım şerefiyle CSS hakkında ki yazılarımı yazmaya başlayayım istedim. Umarım yararlı olurum. 
Öncelikle CSS Hover nedir onu öğrenelim. Hover özelliği sayesinde HTML belgenizde yer alan bir resmin veya yazının fare ile üstüne gelince, bir başka şekil çıkmasını sağlayabilirsiniz. Bir örnek vermek gerekirse;
Sitenizde bulunan logonun üzerine gelince logonun soluk olmasını istiyorsunuz. İşte bu solukluğu hover özelliği ile kolayca yapabilirsiniz.
Benim çok sevdiğim bir özelliktir, eminim sizde seveceksiniz
Nasıl kullanılır?
Hover özelliğini vermek istediğimiz <div></div> için style.css dosyamızda .divadi:hover şeklinde bir özellik belirtiyoruz. Örnek;
Üstteki örnekte yaptığımız işlem, logonun üzerine fare ile geldiğiniz zaman belirleyeceğiniz bir başka resmin çıkmasını sağlamaktır. Eğer logoyu soluk yapmak isterseniz de;
Opacity ayarı sayesinde resmin şeffaflığını çoğaltıp arttırabiliriz.
Öncelikle CSS Hover nedir onu öğrenelim. Hover özelliği sayesinde HTML belgenizde yer alan bir resmin veya yazının fare ile üstüne gelince, bir başka şekil çıkmasını sağlayabilirsiniz. Bir örnek vermek gerekirse;
Sitenizde bulunan logonun üzerine gelince logonun soluk olmasını istiyorsunuz. İşte bu solukluğu hover özelliği ile kolayca yapabilirsiniz.
Benim çok sevdiğim bir özelliktir, eminim sizde seveceksiniz
Nasıl kullanılır?
Hover özelliğini vermek istediğimiz <div></div> için style.css dosyamızda .divadi:hover şeklinde bir özellik belirtiyoruz. Örnek;
Kod:
.logo {background-image: url(../images/logo.png); }
Kod:
.logo:hover {background-image: url(..logonun üstüne gelince çıkacak resim); }
Kod:
.logo {background-image: url(../images/logo.png); }
Kod:
.logo:hover {opacity: 0.4}