Apple.com Tarzı Menü harika menü saten fark etcekseniz
Burayı munünü gözükmesiniz istediğiniz yere ekleyin
ALINTIDIR
hibycocuk.tr.gg
Kod: #applenav {
padding:0px 0px 0px 0px;
background:#cacaca;
-moz-border-radius:4px; /* Mozilla için köşelerimizi yuvarlayalım */
-webkit-border-radius:4px; /* Şimdi de Chrome ve Safari için köşeleri yuvarlayalım */
background-image: -moz-linear-gradient(90deg, #848484, #cacaca); /* Mozilla için Linear Gradient kodumuzu yazdık! */
background-image: -webkit-gradient(linear, left top, left bottom, from(#cacaca), to(#848484)); /* Chrome ve Safari için Linear Gradient kodumuzu yazdık! */
}
/* Menümüzün ul ve li etiketlerini tanımlıyoruz... */
#applenav ul, #applenav li {list-style:none;margin:0;padding:0;}
/* Şimdi menü bağlantılarımızı tanımlamaya başlıyoruz... */
#applenav a {
font:bold 12px/36px arial, verdana, sans-serif;
text-decoration:none;
display:block;
float:left;
width:100px;
height:36px;
color:#252525;
background:#cacaca;
background-image: -moz-linear-gradient(90deg, #848484, #cacaca); /* Menü birimlerindeki Gradienti tanımladık! */
background-image: -webkit-gradient(linear, left top, left bottom, from(#cacaca), to(#848484)); /* Chrome ve Safari'yi unutmadık */
text-shadow:0px 1px 1px #ddd; /* Biraz gölge ekleyelim */
border-right:1px solid #959595;
text-align:center;
}
#applenav a:hover {
font:bold 12px/36px arial, verdana, sans-serif;
text-decoration:none;
display:block;
float:left;
width:100px;
height:36px;
color:#fff;
background:#cacaca;
background-image: -moz-linear-gradient(90deg, #555, #909090); /* Menü hover içindeyken değişen gradientimiz... */
background-image: -webkit-gradient(linear, left top, left bottom, from(#909090), to(#555));
text-shadow:0px 0px 0px #ddd;
border-right:1px solid #909090;
text-align:center;
}
#applenav a.apple {
-moz-border-radius:4px 0px 0px 4px;
-webkit-border-radius:4px 0px 0px 4px;
text-decoration:none;
display:block;
float:left;
width:100px;
color:#fff;
background:#cacaca;
background-image: -moz-linear-gradient(90deg, #848484, #cacaca);
background-image: -webkit-gradient(linear, left top, left bottom, from(#cacaca), to(#848484));
text-shadow:0px 0px 0px #ddd;
border-right:1px solid #909090;
text-align:center;
}
#applenav a.apple:hover {
font:bold 12px/36px arial, verdana, sans-serif;
text-decoration:none;
display:block;
float:left;
width:100px;
height:36px;
color:#fff;
background:#cacaca;
background-image: -moz-linear-gradient(90deg, #555, #909090);
background-image: -webkit-gradient(linear, left top, left bottom, from(#909090), to(#555));
text-shadow:0px 0px 0px #ddd;
border-right:1px solid #909090;
text-align:center;
}
#applenav a.secili {
text-decoration:none;
display:block;
float:left;
width:100px;
color:#fff;
background:#cacaca;
background-image: -moz-linear-gradient(90deg, #525252, #333);
background-image: -webkit-gradient(linear, left top, left bottom, from(#525252), to(#333));
text-shadow:0px 0px 0px #ddd;
border-right:1px solid #909090;
text-align:center;
}
/* ARAMA ALANIMIZIN KODLARINI YAZIYORUZ */
#applenav .apple img {border:0px;}
#applenav .arama {float:left; display:block; width:140px;line-height:32px;margin-left:10px}
#applenav .arama input {
background:#fff url(http://img.webme.com/pic/h/hibycocuk/arama.png) no-repeat left center;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border:1px solid #999;
width:120px;
font:11px arial, verdana, sans-serif;
padding:2px 2px 2px 20px;
color:#999;
}