Vamos a trabajar con las dos con el menú móvil para nuestro proyecto igual no va a funcionar todavía
bien.
Lo veremos en la parte de JavaScript.
Trabajaremos con los eventos pero vamos a tener la estructura ya en CSS y en HTML.
Creamos este tip con la clase menos móvil vamos a crear aquí un comentario que diga en un móvil menú
móvil y le vamos a poner un ancho tanto en un móvil y en aprobemos un Wit de 60 pixeles un display Block
lo vamos a flotar a la derecha float arriba y le ponemos un Texas. La right también para explicar todo
lo que es lo que estamos haciendo aquí en Marien top de 12 pixeles.
Nos hace falta los expansores a copiar y pegar ASPAN.
Creo que es más fácil de hacerlo ya que esté terminado esta parte vamos a una altura cada span de 8
pixeles.
Margin Boron de 6 pixeles para que esa separación.
Y por último un background color white o blanco y por último te vamos a poner un display Block bordamos
cambios y recargamos y vemos que se ve de esta forma nuestro menú de hamburguesa así que todos estos
estilos son los que ocupamos para hacer lo que se ve de esta forma.
Así lo hacemos más pequeño vemos que se ve de esta forma nos hace falta ajustarlo para que se vea acá
en la parte superior pero puedes ver que eso fue lo que intentamos hacer.
Sin embargo cuando está en grande no quiero que se vea así que puedo poner a quien.
Si te acuerdas aquí le ponemos el display Block en el 7 6 8.
Igual aquí lo podríamos poner display Noon en el mismo 7 6 8 así que cuando uno se oculte el otro se
mostrará y cuando el otro se muestre no se va a auscultado y así será la lógica.
Vemos que quien no aparece si lo hacemos más pequeño vemos que aparece y el otro se oculta.
Vamos a ver qué está pasando para que no se termine de ajustar bien vamos a hacer esto un poco más pequeño
y nos posicionamos aquí si es porque el logo no está flotado a la izquierda seamos un flat LEF vemos
que se vería bien.
Un poco de scroll hacia arriba cortamos este de aquí tendría que estar acá recargamos y vemos que se
ve de esta forma
y vemos que se ve bastante bien en nuestro nuestro menú de hamburguesa igual lo que le faltaría sería
que se apareciera el ícono de la manita no y eso es fácil de hacer nada más le ponemos seleccionamos
este Jover y ponemos cursor Painter guardamos cámbiese recargamos y vemos que aparece el botón de la
manita igual como dije cuando demos clic va a expandirse eso lo veremos con JavaScript un poco más adelante
sin embargo vamos a ver que no tengamos que hacerle más ajustes a este menú vamos si era un poco de
scroll y quitarle el display non que tenemos aquí guardo cambios y recargo y vemos que el menú se ve
de esta forma igual aquí le podremos poner un widget 100 por ciento a cada uno recargar y un display
Block.
De esta forma nada más faltaría un texto la inocente
recargamos y así cuando atiende click aquí hay algún error
de navegación principal.
Le hace falta también su propio Clear Fix
podemos ver que se ve bien el menú igual un poco más separado o un margen Boron de 20 pixeles.
Estoy un poco más separado cada uno de ellos y si lo hacemos grande aquí necesitaríamos resetear estos
valores un poco de scroll nos pegamos aquí y la transición no lo ocupamos aquí la vamos a poner un weta
auto un display inline texana encender el mar y en Boron nos Marien cero eso porque vamos a resetear
los valores que ya teníamos margin
desde cero cero cero cero
valientemente pixeles arriba
porque aquí les falta un display en la M Block
y así cuando lo hagamos pequeño se verá el menú de esta forma y cuando lo hagamos grande se verá correcto
así que podemos regresar al el display normal y como dije volver a esta parte cuando estemos con los
eventos de JavaScript para cuando le demos click detecte y expanda el menú veremos algo más este menú
igual va a ser un poco más adelante en la parte de JavaScript.
Sin embargo pudiste ver que con CSS puedes darle los ajustes necesarios para hacerlo ver de la forma
en que tu quieras exactamente como esta sección que tenemos aquí si quieren siguiente vamos a trabajar
con esta sección de la mejor conferencia de diseño web en español.