Step by step how to create CSS Vertical Navigation Menu is as follows:
1. copy the code below:
/ * Extra-menu * /
#menu {
width: 200px;
margin: 10px;
}
#menu li a {
height: 32px;
voice-family: "\"}\"";
voice-family: inherit;
height: 22px;
text-decoration: none;
}
#menu li a:link, #menu li a:visited {
color: #666;
display: block;
background: url(http://i288.photobucket.com/albums/ll179/ahnning/menu.gif);
padding: 10px 0 0 35px;
}
#menu li a:hover {
color: #000;
background: url(http://i288.photobucket.com/albums/ll179/ahnning/menu.gif) 0 -32px;
padding: 10px 0 0 35px;
}
/ * End of the menu * /
2. Paste the code before : ]]></b:skin>
3. And then save the changes. The next step, we will add the code below:
<div id="menu">
<ul>
<li><a href="url" target="_blank" >Link 1</a></li>
<li><a href="url" target="_blank" >Link 2</a></li>
<li><a href="url" target="_blank" >Link 3</a></li>
<li><a href="url" target="_blank" >Link 4</a></li>
and so on ..
</ul>
</div>
in the body, or on the Page Elements, by pressing "add a gadget" and then click the HTML / Javascript
Congratulations to try
Thanks your tutorial.... Always enjoy your time
ReplyDeletewah mas bener2 mantep neh template na..
ReplyDeleteentar sy coba bikin juga ah :D
Great tutorial. I learn a lot. Thanks
ReplyDelete