TeknoAnaliz | Teknoloji & Kişisel blog

Yatay menüv2

Bugün sizlere yine bir yatay css menü yaptım;

#menu { 
width: 800px;
height: 50px;
border: 2px dotted #c3c3c3;
}
#menu ul  {
padding: 0px;
margin: 0px;
list-style-type: none;
}
#menu ul li a {
width: 100px;
height: 50px
display: block;
text-align: center;
text-decoration: none;
color: #006699;
transition: 2s background-color;
float: left;
line-height: 50px;
}
 
#menu ul li a:hover {
background-color: #ff0000;
color: #ffffff;
 }

 

Nerede gözükmesini istiyorsanız; 

<div id="menu">
<ul>
<li><a href="#">TeknoAnaliz.tr.gg </a></li>
<li><a href="#">TeknoAnaliz.tr.gg </a></li>
<li><a href="#">TeknoAnaliz.tr.gg </a></li>
<li><a href="#">TeknoAnaliz.tr.gg</a></li>
<li><a href="#">TeknoAnaliz.tr.gg </a></li>
<li><a href="#">TeknoAnaliz.tr.gg </a></li>
<li><a href="#">TeknoAnaliz.tr.gg </a></li>

</ul>
</div>

NOT: Kalın yerlerle oynama yapınız. Birde "<a href="#"> burda değişiklik yapabilirsiniz.
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol