compartecodigo.com

La forma correcta de realizar un menú en HTML es utilizar un formato de lista (ya sea UL o OL). Las listas por defecto se mostrarán en vertical, pero podemos hacer que nuestro menú tenga una semántica correcta y tener un menú horizontal.

Empezaremos con el menú más simple:
Código HTML para el menú:

<ul id="menu_uno">
	<li><a href="###">Empresa</a></li>
	<li><a href="###">Tiendas</a></li>
	<li><a href="###">Productos</a></li>
	<li><a href="###">Proyectos</a></li>
	<li><a href="###">Servicios</a></li>
	<li><a href="###">Contacto</a></li>
</ul>

Código CSS para el menú más simple:

body {background: #FFF; color: #000; font-family: Arial, sans-serif; font-size: 80%}
#header ul {background: #F2F2F2; list-style: none; margin: 0; padding: 5px;}
#header ul li {display: inline; padding: 0 10px;}
#header ul li a {color: #222;}
#header ul li a:hover {color: #cb0000;}

A partir de este punto, podemos empezar a complicar los estilos y las propiedades del menú (pestanyas, desplegables, clases…). Hemos preparado algunos ejemplos simples (los complicaremos más adelante) que podeis encontrar aquí:
Ver ejemplos de menus horizontales con CSS.