HTML Kodları
<html>
<head>
<meta http-equiv=”content-type” content=”text/html; charset=utf-8″>
<title>CSS Dikey Açılır Menu Tasarımı</title>
<style type=”text/css”>
.menum ul {
margin:0;
padding: 0;
list-style: none;
width:150px;
border-bottom: 1px solid #000;
}
.menum li {
position:relative;}
.menum li ul {
position:absolute;
list-style: none;
left: 149px;
width: 150px;
display: none;
top:0; }
.menum li a {
display: block;
text-decoration: none;
color:#000000;
background-color: #9CF;
font: bold 13px Verdana;
padding: 5px;
border: 1px solid #000000;
border-bottom: 0; }
.menum li a:hover {
background-color: #012D58;
color:#FF0;}
li:hover ul{
display: block;
}
*html ul li {
float:left;
height: 1%;
}
*html ul li a {
height: 1%;
}
</style>
</head>
<body>
<div class=”menum”>
<ul>
<li><a href=”#”>Ana Sayfa</a></li>
<li><a href=”#”>Hakkımızda</a>
<ul>
<li><a href=”#”>Şirket Tarihçesi</a></li>
<li><a href=”#”>Yöneticilerimiz</a></li>
<li><a href=”#”>Çalışanlarımız</a></li>
<li><a href=”#”>Faaliyetlerimiz</a></li>
</ul>
<li><a href=”#”>Hizmetlerimiz</a>
<ul>
<li><a href=”#”>Web Tasarım</a></li>
<li><a href=”#”>Hosting</a></li>
<li><a href=”#”>Logo Tasarım</a></li>
<li><a href=”#”>Danışmanlık</a></li>
</ul>
<li><a href=”#”>Referanslar</a></li>
<li><a href=”#”>İletişim</a></li>
</ul>
</div>
</body>
</html>
Emre VARLI 