Rallover buton
Merhaba arkadaşlar..
Rollover buton yapımının kısa bir açıklaması : "bir buton düşün üstüne gelince değişsin"
Örnek bir buton:
Herkezin anlayabileceği bir dil ile anlatmaya çalıştım.
Öncelikle menümüzün linkini kullanacağımız alanlara koyacağımız kod :
<a class="anasayfa" href="index.html"></a>
Ve Css alanında kullanacağımız kod :
a.anasayfa {
display: block;
width: 100px;
height: 25px;
text-decoration: none;
text-indent:-999px;
background-image: url(buton.gif);
background-repeat: no-repeat;
background-position: right 0;
}
a:hover.anasayfa {
background-position: left 0;
}
Buradaki yapılan işlem çok basit ve kodlamayı bir o kadar kolaylaştırıyor.
Resmin ilk hali ve hover yani üstüne gelince değişen ikinci hali için 2farklı resim yapmak yerine
tek resim üzerinde , kodda yapılan basit değişiklik yapmak yetiyor.
