Hover Menu

Demo

• HTML
• C\C++
• Vb.Net
• Asp.Net
• PHP

Step 1: Insert the following style sheet to the HEAD section of your page:

<style type="text/css"> .hovermenu ul{ font: bold 13px arial; padding-left: 0; margin-left: 0; height: 20px; } .hovermenu ul li{ list-style: none; display: inline; } .hovermenu ul li a{ padding: 2px 0.5em; text-decoration: none; float: left; color: black; background-color: #FFF2BF; border: 2px solid #FFF2BF; } .hovermenu ul li a:hover{ background-color: #FFE271; border-style: outset; } html>body .hovermenu ul li a:active{ /* Apply mousedown effect only to NON IE browsers */ border-style: inset; } </style>

Step 2: Add the below HTML  to the body of your page.

<div class="hovermenu"> <ul> <li><a href="http://cybersorce.blogspot.in/p/eewfewf.html">HTML</a></li> <li><a href="http://cybersorce.blogspot.in/p/cc.html">C\C++</a></li> <li><a href="http://cybersorce.blogspot.in/p/vbnet.html">Vb.Net</a></li> <li><a href="http://cybersorce.blogspot.in/p/aspnet.html">Asp.Net</a></li> <li><a href="http://cybersorce.blogspot.in/p/php.html">PHP</a></li> </ul> </div>

You can have multiple menus on the same page.