CÓDIGO HTML:
<script type="text/javascript">
window.onload=montre; function montre(id) { var d = document.getElementById(id);for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display= 'none';}}
if (d) {d.style.display='block';}
}</script>
<style type="text/css"></style>
<div align="center" id="menu"><dl><dt onmousedown="javascript
:montre('smenu1');">"NOMBRE DE MENU"</dt><dd id="smenu1"><ul><small>
<li><a href="*">"NOMBRE SUBMENU"</a></li><li><a href="*">"NOMBRE SUBMENU"</a></li>
<li><a href="*">"NOMBRE SUBMENU"</a></li>
<li><a href="*">"NOMBRE SUBMENU"</a></li><dt onmouseout="javascript
:montre();"></small></ul></dl><dl>
<dt onmousedown="javascript
:montre('smenu2');">"NOMBRE DE MENU"</dt><dd id="smenu2"><ul><small>
<li><a href="*">"NOMBRE SUBMENU"</a></li><li><a href="*">"NOMBRE SUBMENU"</a></li>
<li><a href="*">"NOMBRE SUBMENU"</a></li>
<li><a href="*">"NOMBRE SUBMENU"</a></li></small><dt onmouseout="javascript
:montre();"></ul></dl><dl>
<dt onmousedown="javascript
:montre('smenu3');">"NOMBRE DE MENU"</dt><dd id="smenu3"><ul><small>
<li><a href="*">"NOMBRE SUBMENU"</a></li><li><a href="*">"NOMBRE SUBMENU"</a></li>
<li><a href="*">"NOMBRE SUBMENU"</a></li><li><a href="*">"NOMBRE SUBMENU"</a></li>
</small><dt onmouseout="javascript
:montre();"></ul></dl><dl>
<dt onmousedown="javascript
:montre('smenu4');">"NOMBRE DE MENU"</dt><dd id="smenu4"><ul><small>
<li><a href="*">"NOMBRE SUBMENU"</a></li><li><a href="*">"NOMBRE SUBMENU"</a></li>
<li><a href="*">"NOMBRE SUBMENU"</a></li>
<li><a href="*">"NOMBRE SUBMENU"</a></li></small><dt onmouseout="javascript
:montre();">
</ul></dl><dl><dt onmousedown="javascript
:montre('smenu5');">"NOMBRE DE MENU"</dt><dd id="smenu5"><ul><small>
<li><a href="*">"NOMBRE SUBMENU"</a></li><li><a href="*">"NOMBRE SUBMENU"</a></li>
<li><a href="*">"NOMBRE SUBMENU"</a></li><li><a href="*">"NOMBRE SUBMENU"</a></li></small>
<dt onmouseout="javascript
:montre();"></ul></dl><dl>
<dt onmousedown="javascript
:montre('smenu6');">"NOMBRE DE MENU"</dt><dd id="smenu6"><ul><small>
<li><a href="*">"NOMBRE SUBMENU"</a></li><li><a href="*">"NOMBRE SUBMENU"</a></li>
<li><a href="*">"NOMBRE SUBMENU"</a></li></small><dt onmouseout="javascript
:montre();"></ul></dl></div>
<div align="center"><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p><p> </p>
<p>
CODIGO CSS:
*{margin:0 auto; padding:0;}
body { background-color: #CCCCCC;color: #0066FF;margin: 0px auto;padding: 0; font: 80% verdana, arial, sans-serif;}
dl, dt, dd, ul, li {margin: 0 auto;padding: 0;list-style-type: none;}
#menu dl {float: left; width: 16%}
#menu dt {cursor: pointer;text-align: center;font-weight: bold;background: #999999;border: 2px solid #000000;}
#menu dd {border: 2px solid #000000;}
#menu li {text-align: center;background: #777777;}
#menu li a, #menu dt a {color: #006600;text-decoration: none;display: block;height: 100%;border: none}
#menu li a:hover, #menu dt a:hover {background: #888888;}
#navcontainer ul{text-align: center;padding: 0;}
#navcontainer li{display: inline;margin: 0 -1px;}
#navcontainer li a{padding: 0px 10px;color: #111;background-color: #888;border: 2px solid #000000;text-decoration: none;}
#navcontainer li a:hover{color:#00FFFF;border: 2px solid #0000FF;border-top: 2px solid #0000FF;border-bottom: 2px solid #0000FF;}
a:link {color: #0000FF;text-decoration: none;}
a:visited {color: #0000FF;text-decoration: none;}
a:hover {text-decoration: none;}
a:active {color: #0000FF;text-decoration: none;}
a.hidden {color: #0000FF;text-decoration: none;}
a.hidden:visited {color: #0000FF;text-decoration: none;}
a.hidden:hover {color: #0000FF;text-decoration: none;}
a.hidden:active {color: #0000FF;text-decoration: none;}
a.nav:link {color: #0000FF;padding: 2px;text-decoration: none;}
a.nav:visited {color: #0000FF;padding: 2px;text-decoration: none;}
a.nav:hover {color: #0000FF;background-color: #666666;padding: 2px;text-decoration: none;}
a.menu {font-family: arial, helvetica, sans-serif;font-weight: bold;text-decoration: none;}
a.menu:hover{font-family: arial, helvetica, sans-serif;font-weight: bold;text-decoration: none;
letter-spacing: 1px;}
a.box{padding: 3px;background-color: #FFFFFF;text-decoration: none;border: medium solid #000000;color: #000000;font-family: Verdana, Arial, Helvetica, sans-serif;}
a.box:hover{color: #000000;padding: 3px;text-decoration: none;background-color: #666666;border: medium solid #3366FF;color: #FFFFFF;font-family: Verdana, Arial, Helvetica, sans-serif;}