Hola, visitante! [ Regístrate | Iniciar SesiónFeed de RSS  |   | 

Comentarios desactivados en Como crear un Menu Responsive con CSS3

Como crear un Menu Responsive con CSS3

| CSS3 | marzo 20, 2013

Hoy les vamos a mostrar como crear un menu de navegacion responsive utilizando solo CSS3.
Te preguntaras porque le llaman responsive? la respuesta es simple, cada dia que pasa, el numero de usuarios que visitan sitios web desde sus dispositivos moviles se incrementa a pasos agigantados.
Es importante que los visitantes de tu sitio web puedan navegar de manera sencilla sin tener que hacer scrolling o zoom en sus dispositivos moviles para poder visualizar el contenido correctamente.
Para lograr un menu responsive existen varias soluciones que incluyen la utilizacion de jquery o javascript, pero estas soluciones incrementan el tiempo de carga de tu sitio web.

1- Codigo HTML

En el codigo HTML podras ver que incluimos

Este tag es necesario para poder ajustar el tamaño del contenido en tu pantalla.

2- Hoja de Estilo CSS

Aqui definimos el estilo para nuestra pagina, elementos de nivel superior y submenu.

CSS/STYLE.CSS

En la hoja de estilo podras ver que hemos agregado responsive rules o reglas.
Cada regla define un estilo para diferentes resoluciones de pantallas y para esto insertamos media queries.
Si deseas aprender mas acerca de media queries, click aqui.

Sin etiquetas

2755 total views, 1 today

  

Enlaces Patrocinados

Justhost
Gomobilego
inDsign
Namecheap
Bluehost
Anunciate