css Resimli Menu yapımı
Resim kullarak menu yapımı nasıl olur bunu anlatacağız.
İlk başta Kategori oluşturmak için liste oluşturan ul ve li etiketlerini kullanacağız.
Kodun görünümü<ul>
<li><a href="#">Anasayfa</a></li>
<li><a href="#">Hakkımızda</a></li>
<li><a href="#">Hizmetlerimiz</a></li>
<li><a href="#">İletişim</a></li>
</ul>
Şimdi
ul li Etiketlerimiz ve kategori isimlerimiz hazır şimdi css kodlarını yazmamız gerekir
Li etiketlerinin oluşturduğu noktayı kaldırmak için
list-style-type:none; kodunu kullanıyoruz
linklerin altındaki çizgiyi kaldırmak içinde text-decoration:none; kullanıyoruz
Kullanılan resim aşagıdadır. istediğiniz şekilde resim yapıp kullanabilirsiniz.
<style type="text/css"><!--
<style type>.menu ul{
float:center;
margin:0px;
padding:0px;
list-style-type:none;
width:1000px;
}
.menu ul li{
float:left;
background: url(img/sol3.png) no-repeat;
}
.menu li a{
display:block;
text-decoration:none;
float:left;
padding:8px 65px 10px 10px;
}
body{
background-color:#49;
}
Linkback: https://www.buyuknet.com/css-resimli-menu-yapimi-t40707.0.html