HTMLKODEFE ~ By Radyasyon

Dikey Koyu Renkli Menu

Dikey olarak kullanılabilecek. CSS ve imaj desteği ile şeffaf geçişler sağlanmış oldukça güzel bir CSS Menü Örneğidir.

 Örnek Çalışmayı buraya komple bilgisayarınıza indirebilirsiniz.

                
<div id="main_body">
<div id="menu_container">
<div id="top">div>
<div id="css_ornegi">
<ul>
<li><a href="http://www.cssornekleri.com"><span>Ana Sayfaspan>a>li>
<li><a href="http://www.cssornekleri.com"><span>Hakkımızdaspan>a>li>
<li><a href="http://www.cssornekleri.com"><span>Hizmetlerimizspan>a>li>
<li><a href="http://www.cssornekleri.com"><span>Referanslarımızspan>a>li>
<li><a href="http://www.cssornekleri.com"><span>İnsan Kaynaklarıspan>a>li>
<li><a href="http://www.cssornekleri.com"><span>İletişimspan>a>li>
ul>
div>
div>
div>
         

<style type="text/css">
#main_body {background: #202B31; width: 400px; padding: 10px;}
ul {list-style: none;margin: 0;padding: 0;}
img {border: none;}
#menu_container {width:200px;background-color: #333A46;margin-left: 15px;margin-top: 36px;}
#top {background-image: url('nav_top.gif');background-repeat:no-repeat;background-position:top left;height: 16px;}
#bottom {background-image: url('nav_bottom.gif');background-repeat:no-repeat;background-position:bottom left;height: 16px;border-top:1px solid #000;}
#css_ornegi {width: 200px;font-family: Arial, Helvetica, sans-serif;margin: 0;font-size: 70%;font-weight: bold;}
#css_ornegi li a {height: 32px;voice-family: ""}"";voice-family: inherit;height: 24px;text-decoration: none;}
#css_ornegi li a:link, #css_ornegi li a:visited {color: #ccc;display: block;background:  url(css_ornegi.gif);padding: 8px 0 0 25px;}
#css_ornegi li a:hover, #css_ornegi li #current {color: #fff;background:  url(css_ornegi.gif) 0 -32px;border-bottom:1px solid #000;padding: 8px 0 0 27px;}
style>