CSS İle Mouse Üzerine Gelince Görünüşün Değişmesi

CSS İle Mouse Üzerine Gelince Görünüşün Değişmesi

Herkese iyi günler dileriz.Bu yazımızda sizlere css ile mouse üzerine gelince görüntünün hangi kodlarla değiştiğini anlatacağız.

Bildiğiniz gibi web sitesi yapmak için bilmemiz gereken en temel dillerden birisi css’dir.Css’de yapılan bir sürü özellik vardır.Bunlardan birisi de sitedeki herhangi bir yazının veya resmin üzerine fare ile geldiğimizde onun görüntüsünü değiştirmektir. Peki bunu hangi kod ile ve nasıl yaparız şimdi onu anlatalım.

Öncelikle bu işlemi css de “:hover” kodu ile yapmaktayız.Şimdi bir örnekle açıklık getirelim.

Html Kodları;

Css Kodları;

Gördüğünüz gibi arkadaşlar 50*50 piksel boyutunda bir kutu yaptık.Öncelikle kutunun rengini kırmızı yaptık ardından :hover kodu ile kutunun üzerine gelince rengi maviye dönüştü.Dikkat ettiyseniz öncelikle #kutu id kodlarını normal olarak yaptık.Buraya kırmızı renk verdik.Ardından #kutu:hover kodu ile mouse üzerine geldiğimizde nasıl görüntü oluşacağını belirledik.Ekran görüntüsü ise aşağıdaki gibi olur.

Önce(Mouse üzerinde değilken);

Sonra(Mouse üzerindeyken);

Evet arkadaşlar sizler de bu şekilde :hover kodu ile fare üzerine geldiğinde şekil veya renk değiştirme yapabilirsiniz.Umarız faydalı olur.Herkese iyi çalışmalar dileriz…


---Bizlere Destek Olmak İçin Aşağıdan Yorum Yazmayı ve Yazılarımızı Sosyal Medyada Paylaşmayı Unutmayınız---
admin

Merhabalar sitemizde sizler için birbirinden kaliteli paylaşımlar yapmaktayız.Her konuda bilgili editör arkadaşlarımızla sizlere faydalı ve eğitici makaleler paylaşmaktayız.Ders notları,seo,oyun,dini bilgiler vb. tüm alanda sizler için en iyi içerikleri üretmekteyiz.Bizleri takip ettiğiniz için teşekkür ederiz...

Benzer Yazılar

Yapılan Yorum (1)

Bir Cevap Yazın

E-posta hesabınız yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

*
*

Time limit is exhausted. Please reload CAPTCHA.