Meniu Vertical CSS pentru Widget sau template

22092012
Meniu Vertical CSS pentru Widget sau template

[Trebuie sa fiti inscris si conectat pentru a vedea acest link]

Acest cod se poate adauga intr-un widget sau o pagina html
Codul meniului :

Cod:

<html>
<head>
<title>Meniu de linkuri cu css – tutorial</title>

<style type="text/css">
#meniu { 
list-style-type:none;
width: auto;
height:30px;

margin:0px;
padding:0px;
}
#meniu li {
 width:180px; height:30px;
border-bottom: 1px solid black;border-top: 1px solid #3E3E3E;
line-height:30px;
text-align:center;
background-color:#000000;
}
#meniu li a:link { 
width:180px; height:30px;
display:block;
 background: rgb(35,35,35); /* Old browsers */ 
background:url(http://i32.servimg.com/u/f32/14/12/03/12/hover212.png); 
text-align:center;
font-family:Arial;
font-size:14px;
font-weight:bold;
color: white;
text-decoration:none;

}
#meniu li a:visited { 
width:180px; height:30px;
display:block;
background-color:#000000;
text-align:center;
font-family:Arial;
font-size:14px;
font-weight:bold;
color: white;
text-decoration:none;
}
#meniu li a:hover { 
background: url(http://i32.servimg.com/u/f32/14/12/03/12/cathea10.gif);
width:180px;height:30px;
display:block;

text-align:center;
font-family:Arial;
font-size:14px;
font-weight:bold;
color:#FFFFFF;
text-decoration:none;
}
</style>

</head>
<body>

<ul id="meniu">
<li><a href="#"><img src="http://cdn2.iconfinder.com/data/icons/crystalproject/16x16/apps/keditbookmarks.png"style="margin-left: -25px;"></img>Tutoriale</a></li>


<li><a href="#"><img src="http://cdn1.iconfinder.com/data/icons/Futurosoft%20Icons%200.5.2/16x16/apps/designer.png"style="margin-left: -25px;"></img>Photoshop</a></li>


<li><a href="#"><img src="http://cdn3.iconfinder.com/data/icons/fatcow/16x16_0640/page_white_code.png"style="margin-left: -25px;"></img>Html</a></li>


<li style="margin-right:0px;"><a href="#"><img src="http://cdn3.iconfinder.com/data/icons/fatcow/16x16_0640/page_white_code_red.png"style="margin-left: -25px;"></img>Tutoriale css</a></li>
</ul>
</body>
</html>