TASARIM>YERLESIM>GADGET EKLE> HTML SCRIPT EKLE ASAGDAKI KODU YAPISTIR BU KADAR BASIT
<title>Css Açılır Dikey Menü Tasarımı</title>
<style type="text/css">
.menu ul {
margin:0;
padding:0;
list-style:none;
width:150px;
border-buttom:1px solid gray;}
.menu li {
position:relative;}
.menu li ul {
position:absolute;
list-style:none;
left:149px;
width:150px;
display:none;
top:0; }
.menu li ul li ul {
position:absolute;
list-style:none;
left:149px;
width:150px;
display:none;
top:0; }
.menu li a {
display:block;
text-decoration:none;
color:#000;
background-color:#fc3;
font:bold 13px ;
padding:5px;
border:1px solid #cca "times new roman";
border-buttom:0;}
.menu li a:hover{
background-color:#012D58;
color:#FF0;
}
li:hover ul {
display:block;
}
li ul li:hover ul {display:block;}
* html ul li {
float:left;
height:1%; }
</style>
</head>
<body>
<div class="menu">
<ul>
<li ><a href="#">Anasayfa</a></li>
<li><a href="#">Hakkımızda</a>
<ul>
<li><a href="#">Şirket Tarihçesi</a></li>
<li id="1"><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>
<ul>
<li><a href="#">Resimli Logo</a></li>
<li><a href="#">Rakamla Logo</a></li>
<li><a href="#">Sayıyla Logo</a></li>
</ul>
<li><a href="#">Danışmanlık</a></li>
</ul>
<li><a href="#">Referanslarımız</a></li>
<li><a href="#">İletişim</a></li>
</ul>
</div>
</body>
</html>
Hiç yorum yok :
Yorum Gönder