Diego Venegas
Inicio Foro Blog
Menu del sitio
Anuncios Patrocinados

Mi Pagina

Menu 03

Codigo Menu:
<div class="menu">

<ul>
<li><a href="../menu/index.html">Menu 1<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->

<ul>
<li><a href="#">Link 1.1</a></li>
<li><a href="#">Link 1.2</a></li>
<li><a href="#">Link 1.3</a></li>
<li><a href="#">Link 1.4</a></li>
 <li><a href="#">Link 1.5</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>

<li><a href="../boxes/index.html">Menu 2<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">Link 2.1</a></li>
<li><a href="#">Link 2.2</a></li>
<li><a href="#">Link 2.3</a></li>
<li><a href="#">Link 2.4</a></li>
<li><a href="#">Link 2.5</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>

<li><a href="../mozilla/index.html">Menu 3<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">Link 3.1</a></li>
<li><a href="#">Link 3.2</a></li>
<li><a href="#">Link 3.3</a></li>
<li><a href="#">Link 3.4</a></li>
<li><a href="#">Link 3.5</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>

<li><a href="../ie/index.html">Menu 4<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li><a href="#">Link 4.1</a></li>
<li><a href="#">Link 4.2</a></li>
<li><a href="#">Link 4.3</a></li>
<li><a href="#">Link 4.4</a></li>
<li><a href="#">Link 4.5</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>

</ul></div>


CSS:
<style type="text/css">
#info {height:500px;}

.menu {font-size:0.85em; padding-bottom:100px; width:100%;}

.menu ul {padding:0;margin:0;list-style-type:none; height:3em; background:transparent;}

.menu ul ul {width:15em;}

.menu ul li {float:left;height:3em;line-height:3em; display:block;}

.menu ul ul li {display:block;width:12em;height:auto; line-height:1em;}

.menu a, .menu a:visited {display:block;float:left;height:100%; width:7em; font-size:1em;text-decoration:none;color:#000;background:#949e7c url(https://img.webme.com/pic/d/diegovenegas/top_grad.gif) center center; padding:0 3em 0 1em; border-left:1px solid #eee; border-right:1px solid #000;}

* html .menu a, * html .menu a:visited {width:11em; width:7em;}

.menu ul ul a, .menu ul ul a:visited {display:block;background:#5b8686 url(https://img.webme.com/pic/d/diegovenegas/sub_grad.gif); color:#fff;width:9em;height:100%;line-height:1em; padding:0.5em 1em; border-bottom:1px solid #7aa;}
* html .menu ul ul a, * html .menu ul ul a:visited  {width:9em; width:9em;}

.menu table {border-collapse:collapse; padding:0; margin:-1px; width:0; height:0; font-size:1em; z-index:1;}

.menu ul ul ul a, .menu ul ul ul a:visited {background:#b4be9c url(https://img.webme.com/pic/d/diegovenegas/sub_grad.gif);}

.menu ul ul ul ul a, .menu ul ul ul ul a:visited {background:#c4ceac url(https://img.webme.com/pic/d/diegovenegas/sub_grad.gif);}

.menu ul :hover a.sub1 {background:#447b7b;}

.menu ul ul :hover a.sub2 {background:#447b7b;}

* html .menu a:hover {color:#ff0;background:#d4d8bd url(https://img.webme.com/pic/d/diegovenegas/top_grad_2.gif) center center; position:relative; z-index:100;}
.menu li:hover {position:relative;}
.menu :hover > a {color:#ff0;background:#d4d8bd url(https://img.webme.com/pic/d/diegovenegas/top_grad_2.gif) center center;}

* html .menu ul ul a:hover{color:#ff0;background:#7aa; position:relative; z-index:110;}
.menu ul ul li:hover {position:relative;}
.menu ul ul :hover > a {color:#ff0;background:#7aa;}

* html .menu ul ul ul a:hover {background:#7aa; position:relative; z-index:120;}
.menu ul ul ul :hover > a {background:#7aa;}

.menu ul ul ul ul a:hover {background:#7aa; position:relative; z-index:130;}

.menu ul ul {visibility:hidden;position:absolute;height:0;top:3em; left:0; width:14em;}

.menu ul ul ul{left:12em;top:0;width:14em;}

.menu ul :hover ul{visibility:visible; height:auto; padding:0 3em 3em 3em; background:transparent url(images/trans.gif); left:-3em;}

.menu ul :hover ul ul{visibility:hidden;}

.menu ul :hover ul :hover ul ul{visibility:hidden;}

.menu ul :hover ul :hover ul{visibility:visible; left:9em;}

.menu ul :hover ul :hover ul :hover ul {visibility:visible;}


</style>
<!--[if lte IE 6]>
<style type="text/css">
.menu ul ul {left:-1px; margin-left:-1px;}
</style>
<![endif]-->
Copyright MyCorp © 2009
Internet
My Plugoo

=> ¿Desea una página web gratis? Pues, haz clic aquí! <=