CSS de bu dersimizde artık biraz etkileşime geçecez.Etkileşim yani eventlar.Daha çok javascript işidir ama cssde de ufak bir tana var.
Sayfada her hangi bir nesnenin üzerine gelince işlem yapmak için :hover parametresini kullanırız.Kodla görelim hemen.
.buton:hover{background:red;}
.link a:hover{color:blue;}
ilkinde buton clasına ait nesnenin üzerine mouse ile gelirsek arkaplanını kırmızı yap dedik.
diğerinde link clasına ait objenin içindeki a nın üzerine gelirsek rengini mavi yap dedik.
Genel örnek :
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>cArleone</title>
<style type="text/css">
.buton{width:100px;height:25px;background:red;}
.buton:hover{width:200px;height:50px;}
</style>
</head>
<body>
<div class="buton"></div>
</body>
</html>
Yukarda butonna 100x25 boyutunu verdik eğer mouse ile üzerine gelirse yani hover olursa boyutu 200*50 olsun dedik.Hover çok kullanacağımız güzel bir özellik.