Menu Horizontal em Tonalidades Cinza/Azul - Submenus em Queda Cinza
Controle por CSS

Menu e submenus em tonalidades de cinza. Os submenus são em queda, exibindo os links na cor normal, os quais são cobertos de cinza quando se passa o mouse sobre eles. Pode-se controlar o tamanho das áreas dos links do menu principal pelo css de modo a comportar mais links. Os fundos dos links do menu podem ser exibidos na cor azul; para isso são necessários alguns acertos na folha de css.

Veja o script tal como se acha no código-fonte:

<div>
<ul class="menu">
<li class="top"><a href="#" class="top_link"><span>Amostra Menu</span></a></li>
<li class="top"><a href="#" class="top_link"><span>Amostra Menu Texto mais longo</span></a>
<ul class="sub">
<li><a href="#">Amostra Menu Este pode ser exemplo de texto mais longo</a></li>
<li><a href="#">Amostra Menu</a></li>
<li><a href="#">Amostra Menu</a></li>
<li><a href="#">Amostra Menu</a></li>
<li><a href="#">Amostra Menu</a></li>
</ul>
</li>
<li class="top"><a href="#" class="top_link"><span>Amostra Menu</span></a>
<ul class="sub">
<li><a href="#">Amostra Menu</a></li>
<li><a href="#">Amostra Menu</a></li>
<li><a href="#">Amostra Menu</a></li>
<li><a href="#">Amostra Menu Texto mais longo</a></li>
</ul>
</li>
<li class="top"><a href="#" class="top_link"><span>Amostra Menu</span></a></li>

</ul>
</div> 

Nota: Se você gostou deste menu, coloque um link para esta página para que as pessoas que visitam o seu site possam conhecê-lo também. O link pode ser assim:

<a href="http://www.otimizacao-sites-busca.com/criar-menus-css/queda-cinza/index.html" target="_blank" title="Menu Horizontal com Fundo Cinza/Azul e Sub-menus em Queda, em Tons de Cinza - CSS">Menu Horizontal e em Queda com Fundo Cinza/Azul</a>

Links relacionados:

Gerador de CSS

Menu Horizontal com Fundo Colorido

Menu Horizontal com Cobertura Colorida

Cor e Forma Predefinidos

Sub-menus em Queda em Barra Horizontal

Menu Multinível

Taulado e em Queda

Queda - Cores do Sol ao Nascer