Sade ama işe yarar hoş bir menü oldu. Yazı rengi siyah, üstüne gelince kırmızı oluyor ve linkin altına çizgi çıkıyor.
Css kısmından renk ayarları değiştirilebilir.
Menümüzün Kod Kısmı:
<html>
<head>
<style type="text/css">
ul#menu{
font-family: Arial;
font-size: 12px;
font-weight: bold;
text-align:center;
list-style: none;;
padding: 7px 0;
border-bottom: 1px solid #CCC;
text-align: center;
}
ul#menu li{
display: inline;
margin: 0 3px;
}
ul#menu a{
text-decoration: none;
padding: 0 0 3px;
border-bottom: 4px solid #FFF;
color: #000000;
}
ul#menu a:hover{
border-color: #FF0000;
color: #FF0000;
}
</style>
</head>
<body>
<table><tr><td>
ANA SAYFA
HAKKIMIZDA
ÜRÜNLER
HİZMETLER
İLETİSIM
</td></tr></table>
</body>
</html>
Ekran Görüntüsü:
İşte kodlarımız da bundan ibaret.
Html kısmında ul içinde
etiketlerine yerleştirdik kategorilerimizi.
ul idsini menu yaptık.
Css kısımında da menü özellikleri verdik.
Css kısmından renk ayarları değiştirilebilir.
Menümüzün Kod Kısmı:
<html>
<head>
<style type="text/css">
ul#menu{
font-family: Arial;
font-size: 12px;
font-weight: bold;
text-align:center;
list-style: none;;
padding: 7px 0;
border-bottom: 1px solid #CCC;
text-align: center;
}
ul#menu li{
display: inline;
margin: 0 3px;
}
ul#menu a{
text-decoration: none;
padding: 0 0 3px;
border-bottom: 4px solid #FFF;
color: #000000;
}
ul#menu a:hover{
border-color: #FF0000;
color: #FF0000;
}
</style>
</head>
<body>
<table><tr><td>
ANA SAYFA
HAKKIMIZDA
ÜRÜNLER
HİZMETLER
İLETİSIM
</td></tr></table>
</body>
</html>
Ekran Görüntüsü:
İşte kodlarımız da bundan ibaret.
Html kısmında ul içinde
etiketlerine yerleştirdik kategorilerimizi.
ul idsini menu yaptık.
Css kısımında da menü özellikleri verdik.
Ama Daha İyileri Var
