jueves, 22 de mayo de 2014

Menu sencillo con html5 / css3

Paso 1: Crearemos un archivo html para crear nuestra estructura basica de nuestro menú:





















En este momento nuestro menú se visualiza de la siguiente manera:









Como observamos todo menu es una lista pero nosotros no queremos vizulizarlo de esta manera tonces aplicaremos los estilos css:


Empezamos aplicándole a todos a todos las etiquetas li que esten dentro de la etiqueta ul dentro de la clase #menu el atributo Display: inline-blok;



Obtendremos el siguiente resultado:






Ahora Agregaremos nuestro fondo donde esta contenido nuestro menú  y quitaremos el subrayado de los enlaces, le daremos color y tamaño a nuestro texto.




Nos quedar algo asi:









Agregaremos un hover a nuestro menu:







Obteniendo nuestro resultado final de Menu sencillo con css:


Share This Article Facebook +Google Twitter Digg Reddit