Yatay css menuv1
Bugün sizlerle yatay menü yapıcağız, ilk olarak html kodlarından başlayalım;<div id='Mungess'>
<ul>
<li><a href='#'><span>Home</span></a></li>
<li><a href='#'><span>Bize ulaşın!</span></a></li>
<li><a href='#'><span>Ziyaretçi Defteri</span></a></li>
<li><a href='#'><span>Kategoriler</span></a></li>
<li><a href='#'><span>Hakkımda</span></a></li>
</ul>
</div>
Html kodumuzu yazdık, sizler sadece "Kırmızı" olan yerleri değiştirin, şimdi bunun css kodunu yazalım;
Html kodumuzu yazdık, sizler sadece "Kırmızı" olan yerleri değiştirin, şimdi bunun css kodunu yazalım;
#Mungess {
width: 800px;
height:37px;
margin: 0px auto 0 auto 0;
}
#Mungess ul {
list-style-type:none;
margin:0;
padding:0;
}
#Mungess ul li a {
width:160px;
background-color: #56aaff;
line-height:37px;
float:left;
color:#ffffff;
text-align:center;
text-decoration:none;
transition:2s background-color;
}
#Mungess ul li a:hover {
background-color: #007fff;
}
Css kodumuzda bitti. Sadece "Kırmızı" ile belirtiğim yerlere oynama yapınız.
Css kodumuzda bitti. Sadece "Kırmızı" ile belirtiğim yerlere oynama yapınız.
