Te agradezco Álvaro que te hayas tomado el tiempo de hacer este video ya que estoy dando mis primeros pasos con CSS y me parece entendible los términos utilizados.
Felicidades por la capacidad docente, eres una rara avis y se aprecia mucho! Explicar por qué se está haciendo algo es sumamente útil. Muchos aplausos y gracias por ayudar a entender cosas que no entendía! (p.e. los relative-absolute).
Junio 19/ 2021 >>>> GRACIAS POR COMPARTIR TAN INTERESANTE INFORMATION. OJALÁ Y PUEDA MEMORIZARLO TODO Y PONERLO EN PRÁCTICA. ODIO "COPIAR Y PEGAR",... ES COMO SI NO APRENDIERA NADA... SOLO COPIAR.
Excelentes vídeos, soy un principiante y de verdad es muy entendible todo, como comentaron abajo, también me gustaría que pudieses hacer el tutorial de Emmet. Gracia y saludos
Gracias... esto es más fácil de usar que los menús desplegables desplegables múltiples en materializecss y funciona dentro de materialisecss, modificando la etiqueta nav por alguna otra
Lo hice y me salio solo tuve que cambiar una ul por li pero para que quede así tal cual esta porque quise hacerle algunas modificaciones como por ejemplo centrarlo y la verdad no pude es obvio que por falta de experiencia aunque últimamente aprendí muchísimo con todos los vídeos y paginas de horas y horas viendo para crear mi propio estilo y no quedarme con un solo menú. Igual para seguir aprendiendo muy bueno!!!
Muy bien explicado el video !! estoy aprendiendo mucho, pero quiero saber como centrar el margen de los "subitem" al del "item" para que no quede cargado a la derecha, gracias de antemano !!
Excelente tutorial. ¿Podrías decirme que código hay que poner para que el menú principal no se abra automáticamente al posar el cursor sobre él y además como poner un scroll que sea funcional en el submenú principal? Muchas gracias.
Tengo una consulta, en el 2do nivel nav > ul > li > lu {top:100%;} es necesario?, no lo puse (para probar qué pasaba) y me ocurrió que en el tercer nivel nav ul ul ul {left:100%; top:0} fue necesario, si no lo ponía, el tercer nivel aparecía al lado del subitem 4.
Excelente tutorial, podrías explicar como utilizarlo ya con links, ya que al ponerle en mi caso, desaparece el menú y me muestra la pagina que mando llamar en cada opción. Es decir que no desaparezca el menú.
Alvaro, muchas gracias por compartir tu experiencia, soy nuevo en esto, pero lo explicas bastante ordenado y claro. Tuve un solo problema al escribir el código que no se como resolverlo... uno de los sub items tiene el texto un poco más largo que el resto, y me modifica el tamaño del bloque en ese item, entonces con el hover, cuando paso con el mouse por ese item, se nota mucho y queda feo. ¿qué resuelve el tamaño de los items en los submenu?
porque poner background en el nav > ul { , si cuando lo pongo en el nav > ul > li{ me pone background tmbn ????? en que cambia, en que salgo con desventaja ?
Me ha venido muy bien este tutorial, muchas gracias por hacerlo. Tengo una pequeña duda, al poner una imagen debajo del menú, paso el ratón por el menú desplegable y la imagen se me baja. ¿alguna idea? gracias!
Buen video, una consulta para que los cambios se muestren en el navegador con livestyle(así mencionaste creo) es presionando control + S o mientras vas escribiendo??
Yo uso Prepros para trabajar talvez ya lo conoces, Este programa me hace cambios en vivo si modifico cualquier archivo de mi web como: css,scss,less,styl, html,etc., Y lo más chevre es que me permite ver al mismo tiempo la web que estoy trabajando en teléfonos, tabletas, etc. Si hago un cambio en el cualquier archivo que este trabajando se refresca en todos los dispositivos que tenga abierto el archivo. Pero hace muchas cosas mas. Amo este programa, y es gratis solo hay que aguantar los anuncios que salen cada cierto tiempo como los que salen en sublime Saludos :)
edwin ramirez Una consulta, pero para poder ver esos cambios hay que estar dandole guardar al archivo en sublime verdad? y automaticamente se refresca, o estoy haciendo algo mal? porque tengo q darle guardar para q recien se actualize solo y vea el cambio.
Cuando por fin te enteras por qué se llama 'ED' y de paso te encuentras con el viejo Alvaro xd Por favor dime como le hiciste para ahora verte tan bien para poder hacer lo mismo. Excelente video, de mucha ayuda
ya cuando empezó a darle class="menu" alli se me comenzò a malograr todo..me sale item2 encima del item1 y los subitem y sub subitems aparecen y no se ocultan...
Hola muy buen vídeo. pero cuando haces la ventana del navegador mas pequeña se modifica el menú , el menú de horizontal pasa a vertical, algún código para que el menú se quede fijo? espero que me puedas contestar gracias.
No entiendo en min: 10:15 como es que nav > ul "no tiene atura" y al darle un overflow: hidden; "ahora si tiene altura y rodea a los elementos 'li'??? Es decir, cómo es que al darle overflow: hidden el elemento ahora si contiene a los elementos que antes por estar flotando se habian salido de él? Gracias de antemano y Saludos.
Perdón, perdón, no lo decía en mal sentido XD Lo decía por que tú mismo lo mencionaste en el curso de css cuando te preguntaron que por qué overflow: hidden; arreglaba eso, y tú mismo dijiste que no lo sabías por que overflow es para otra cosa que nada que ver XD
Hola Alvaro, espero que este bien . Estuve viendo el menú y me entro una duda, cuando haces la transición, ¿por que dices que solo funciona con max-height en lugar de height?. Yo hice algunas pruebas y funciona mas fluido con height que con max-height, además si le das tiempos mayores a un segundo, ocurre que los subitems se despliegan muy rápido y se contraen lento, al contrario que con height, donde la transicion es constante. Saludos, espero que me respondas.
Hola Alvaro, muy buen video, tengo una pregunta usaste float: left y tu menu se ubico a la izquierda, ahora si lo quisiera poner el menu a la derecha con float como haria? puse el float:right. pero se me desordena el menu comienza de atras pa adelante
Hola saludos, y primero que nada felicitarlo por la buena explicación que hace en los vídeos, y segundo es con respecto a este vídeo, como sugerencia podrías hacer que este menú sea responsivo?. seria de gran utilidad. Gracias de ante mano.
Actualmente estoy trabajando en ED menú, una librería css/js para crear menús responsive que será un componente de ED GRID. pronto lo tendré listo. Si ni no conoces el framework ED GRID puedes buscarlo en el canal. Saludos.
Escuela Digital gracias. Estoy revisando el framework y me parece genial. Espero que el menú tenga la por posibilidad de submenus y sub submenus. Me seria de gran utilidad. De nuevo gracias y exitos
Hola soy nuevo en tu canal me ha llamado mucho la atención la manera y facil de enseñar... espero me puedas ayudar cuando pones esta pequeña instrucción ul>li*5>a[href="#"]{Item $} se necesita de un plugin en sublime text para que al momento de ejecutar se cree todas las instrucciones ?? de ante mano muchas gracias.
+Jairo Alejandro Espejo Mendoza Seguí paso por paso, abri tu sublime text, presiona CTRL+SHIFT+P, te aparece un cuadro de texto, coloca install package control y dale enter, cuando termine de instalar, cerra y volve a abrir el sublime, despues presiona de nuevo CTRL+SHIFT+P y escribis emmet, le das enter y reinicias el sublime. Listo :)
Aprende a crear sitios web hermosos con CSS 🤩
*Nuestro curso es completamente gratis* , tómalo aquí 🎁 ed.team/cursos/css
Lo colocaste el GitHub
jajajaja, llegué este año a a EDTeam y no había visto esta "imagen" de antes... gran evolución!!!!
No solo explicaste el tema sino que tambien fuiste dando buenas practicas, excelente
llevo 14 minutos y que bien explicado y organizado ! y sobre todo, a cada singolo paso! me encanta ! por fin entiendo
genial
Te agradezco Álvaro que te hayas tomado el tiempo de hacer este video ya que estoy dando mis primeros pasos con CSS y me parece entendible los términos utilizados.
eres un crack amigo , apenas me estoy metiendo a aprender programación web y te entiendo mucho mejor que a mis instructores :D
Alvaro, gracias por compartir tus conocimientos, mis felicitaciones excelente tus vídeos.
saludos.
Alvaro la verdad que sos un excelente profesor!!!! hiciste sencillo algo que mi profesor la hizo larga. segui asi! muchas gracias!
Hombre muchas gracias, habia visto un mundo de tutoriales y este es el mejor, el que me ha servido y muy bien explicado.
Felicidades por la capacidad docente, eres una rara avis y se aprecia mucho! Explicar por qué se está haciendo algo es sumamente útil. Muchos aplausos y gracias por ayudar a entender cosas que no entendía! (p.e. los relative-absolute).
¡Muchísimas gracias! Nos alegra que te hayan sido de ayuda los vídeos.
La mejor explicación que he visto ¡¡¡¡EXCELENTE!!!!
minuto 16:38 y he solucionado una gran cantidad de dudas. Excelente explicacion.
¡Gracias!
Eres un capo, que limpio tu código, pocas líneas y ordenado.
Que crack que sos, me ayudaste un montón, fuiste claro y limpio en tu explicación. Excelente!
Junio 19/ 2021 >>>> GRACIAS POR COMPARTIR TAN INTERESANTE INFORMATION. OJALÁ Y PUEDA MEMORIZARLO TODO Y PONERLO EN PRÁCTICA. ODIO "COPIAR Y PEGAR",... ES COMO SI NO APRENDIERA NADA... SOLO COPIAR.
Excelente trabajo aunque me tomo mas de una hora pude hacerlo ! Muchas Gracias por enseñar !
Te felicito por la calidad de este video, excelente para aprender, gracias por explicar hasta el más mínimo detalle
2021 y me ayudo perfecto, que buen video.
Es justo el video que estaba buscando, eres un buen profesor, te felicito
Excelentes vídeos, soy un principiante y de verdad es muy entendible todo, como comentaron abajo, también me gustaría que pudieses hacer el tutorial de Emmet. Gracia y saludos
gracias por este tutorial estaba mal acostumbrado a hacer menus con spry pero ahora se hacerlo de cero con css
Excelente geniall me vino barbarooo .. ya q copiar y no saber q ni como hace...una genialidad
Eternamente agradecido por sus videos, muchas gracias!
excelente explicacion muy claro y didactico, felicitaciones!
Como siempre ***** muy buena explicación en este video, como se dice en México eres "la ley" en CSS
Gracias Alvaro! Tu video es el mejor que encontré. Esta muy bien explicado. Ya me subscribí. Mucho éxito para ti!!
Sos un genio, excelemte explicacion gracias por compartir tus conocimientos
excelente profesor quisiera inscribirme en los cursos que dicta este docente explica muy bien y capte a la primera
Gracias... esto es más fácil de usar que los menús desplegables desplegables múltiples en materializecss y funciona dentro de materialisecss, modificando la etiqueta nav por alguna otra
Lo hice y me salio solo tuve que cambiar una ul por li pero para que quede así tal cual esta porque quise hacerle algunas modificaciones como por ejemplo centrarlo y la verdad no pude es obvio que por falta de experiencia aunque últimamente aprendí muchísimo con todos los vídeos y paginas de horas y horas viendo para crear mi propio estilo y no quedarme con un solo menú. Igual para seguir aprendiendo muy bueno!!!
Hola EDTeam gracias por enseñar y compartir excelente vídeo todo muy claro, muy bien explicado y un codigo muy limpio, ya me suscribí a tu canal.
Muy bueno...
Gracias Maestro. Me ha servido de mucho
Muy bien explicado el video !! estoy aprendiendo mucho, pero quiero saber como centrar el margen de los "subitem" al del "item" para que no quede cargado a la derecha, gracias de antemano !!
precisamente lo que estaba buscando muchas gracias muy bien explicado
Buen video. Una pregunta.¿Puedo reutilizar este video sin reclamos de copyright? @EDteam
Excelente tutorial. ¿Podrías decirme que código hay que poner para que el menú principal no se abra automáticamente al posar el cursor sobre él y además como poner un scroll que sea funcional en el submenú principal? Muchas gracias.
Tengo una consulta, en el 2do nivel nav > ul > li > lu {top:100%;} es necesario?, no lo puse (para probar qué pasaba) y me ocurrió que en el tercer nivel nav ul ul ul {left:100%; top:0} fue necesario, si no lo ponía, el tercer nivel aparecía al lado del subitem 4.
Excelente tutorial, podrías explicar como utilizarlo ya con links, ya que al ponerle en mi caso, desaparece el menú y me muestra la pagina que mando llamar en cada opción. Es decir que no desaparezca el menú.
Excelente video, gracias por digerirlo y darnoslo masticado. Saludos y bendiciones
Muy buenas. Genial video. El único problemilla que tuve es que al habilitar "nav li:hover > ul >li" no se me abre el apartado de Sub subitems
Hola, que tal!! disculpa, cuál es el link para la 2da y 3ra parte de tu video?
Genial hermano, Que bueno, Que Dios te continue dando este gran dón de compartir. Saludos, Raciel
buena clase excelente tu forma de explicar .
Alvaro, muchas gracias por compartir tu experiencia, soy nuevo en esto, pero lo explicas bastante ordenado y claro. Tuve un solo problema al escribir el código que no se como resolverlo... uno de los sub items tiene el texto un poco más largo que el resto, y me modifica el tamaño del bloque en ese item, entonces con el hover, cuando paso con el mouse por ese item, se nota mucho y queda feo. ¿qué resuelve el tamaño de los items en los submenu?
gracias por lo de display: table, me solucionastes la vida amigo jajajaj
GRACIAAAS ME SIRVIÓ DEMASIADO PARA MI TAREA, SUPER FÁCIL.
simplemente excelente... eso son BPP bien aplicadas... me encanto
que opinas de usar en lugar de display: table , usar position : absolute???
¡Buenísimo! Muchas gracias.
Excelente, muy bien explicado y todo, muy muy muy bueno, gracias, muchas gracias.
porque poner background en el nav > ul { , si cuando lo pongo en el nav > ul > li{ me pone background tmbn ????? en que cambia, en que salgo con desventaja ?
gracias me ayudo mucho , quisiera saber, como hacer para que el menú se muestre sobre otros elementos
muy buen tutorial, favor indica como hacerlo responsive gracias
Muchas gracias amigo, lo haces ver fácil. !!!
excelentemente explicado, ha sido de mucha ayuda
Me ha venido muy bien este tutorial, muchas gracias por hacerlo. Tengo una pequeña duda, al poner una imagen debajo del menú, paso el ratón por el menú desplegable y la imagen se me baja. ¿alguna idea? gracias!
me encanto el video muy bien explicado y pude hacer lo que queria y muy entendible muchas gracias
Buen video, una consulta para que los cambios se muestren en el navegador con livestyle(así mencionaste creo) es presionando control + S o mientras vas escribiendo??
excelente, sin tanto cóodigo, muchas gracias
UN BUEN VIDEO ...SE MERECE MANITA ARRIBA
Yo uso Prepros para trabajar talvez ya lo conoces, Este programa me hace cambios en vivo si modifico cualquier archivo de mi web como: css,scss,less,styl, html,etc., Y lo más chevre es que me permite ver al mismo tiempo la web que estoy trabajando en teléfonos, tabletas, etc. Si hago un cambio en el cualquier archivo que este trabajando se refresca en todos los dispositivos que tenga abierto el archivo.
Pero hace muchas cosas mas. Amo este programa, y es gratis solo hay que aguantar los anuncios que salen cada cierto tiempo como los que salen en sublime Saludos :)
Si exactamente ese, si trabaja también remoto es muy fácil configurarlo
edwin ramirez Una consulta, pero para poder ver esos cambios hay que estar dandole guardar al archivo en sublime verdad? y automaticamente se refresca, o estoy haciendo algo mal? porque tengo q darle guardar para q recien se actualize solo y vea el cambio.
si debes primero darle a guardar o ctrl + s al archivo que estas trabajando para ver los cambios en el navegador
Cuando por fin te enteras por qué se llama 'ED' y de paso te encuentras con el viejo Alvaro xd
Por favor dime como le hiciste para ahora verte tan bien para poder hacer lo mismo.
Excelente video, de mucha ayuda
Impecable! Muchas gracias.
por que float left y no display inline??
exelente video aprendi bastante muy buena explicacion
genial, espero los otros 2 tutos y porfa también haz un tuto sobre los atajos o trucos interesantes de emmet
ya cuando empezó a darle class="menu" alli se me comenzò a malograr todo..me sale item2 encima del item1 y los subitem y sub subitems aparecen y no se ocultan...
Buen día disculpen cual es ese programa que utilizó?
Buen video, la segunda parte de este video aun no ha salido ???
Hola muy buen vídeo. pero cuando haces la ventana del navegador mas pequeña se modifica el menú , el menú de horizontal pasa a vertical, algún código para que el menú se quede fijo? espero que me puedas contestar gracias.
No entiendo en min: 10:15 como es que nav > ul "no tiene atura" y al darle un overflow: hidden; "ahora si tiene altura y rodea a los elementos 'li'??? Es decir, cómo es que al darle overflow: hidden el elemento ahora si contiene a los elementos que antes por estar flotando se habian salido de él? Gracias de antemano y Saludos.
Ni Álvaro sabe!! XD
overflow:hidden es un hack famoso de hace muchos años para limpiar floats. El otro es display:table.
Si no se supiera, no estaría en el video.
Perdón, perdón, no lo decía en mal sentido XD
Lo decía por que tú mismo lo mencionaste en el curso de css cuando te preguntaron que por qué overflow: hidden; arreglaba eso, y tú mismo dijiste que no lo sabías por que overflow es para otra cosa que nada que ver XD
SemibetaProject pa que te digo que no si si 😊. Pero es un hack que se ha usado toda la vida para limpiar los floats.
Buen video, tengo uan duda, como hago para centrar el menu??, ya intente con text align etc, gracias
Sos un genio brother mil felicitaciones
Hola Alvaro, espero que este bien . Estuve viendo el menú y me entro una duda, cuando haces la transición, ¿por que dices que solo funciona con max-height en lugar de height?. Yo hice algunas pruebas y funciona mas fluido con height que con max-height, además si le das tiempos mayores a un segundo, ocurre que los subitems se despliegan muy rápido y se contraen lento, al contrario que con height, donde la transicion es constante.
Saludos, espero que me respondas.
ahora lo entendí Alvaro... Gracias ...
Hola muy buen video ¿ el código esta subido en algun lugar?
que buen tutorial!! buen docente!! Gracias!!
Genial video, me ayudaste un monton.
Hola Alvaro, muy buen video, tengo una pregunta usaste float: left y tu menu se ubico a la izquierda, ahora si lo quisiera poner el menu a la derecha con float como haria? puse el float:right. pero se me desordena el menu comienza de atras pa adelante
Creo que el efecto hover con transition no se ve con animacion. Creo que se debe a los prefijos para los navegadores.
Alvaro, editor utilizas?
gracias me ayudaste un monton..
Me gustó mucho. Gracias.
muy buen video gracias
Hola saludos, y primero que nada felicitarlo por la buena explicación que hace en los vídeos, y segundo es con respecto a este vídeo, como sugerencia podrías hacer que este menú sea responsivo?. seria de gran utilidad.
Gracias de ante mano.
Actualmente estoy trabajando en ED menú, una librería css/js para crear menús responsive que será un componente de ED GRID. pronto lo tendré listo. Si ni no conoces el framework ED GRID puedes buscarlo en el canal. Saludos.
Escuela Digital gracias. Estoy revisando el framework y me parece genial. Espero que el menú tenga la por posibilidad de submenus y sub submenus. Me seria de gran utilidad. De nuevo gracias y exitos
Tremendoo!!! muy bueno!
Muy bien amigo eres bueno explicando, ya me subscribi! espero mas vídeos.
Bien explicado, Gracias
Muy buen aporte...
MUY BUEN VIDEO
Cuál es el atajo para completar las palabras automáticamente en Sublime Text? O las completa solo?
Buena Maestro !!! Podrías enseñarnos como hacer una Tienda virtual web?
excelente contenido 👌
Hola me gusta como marcha todo, pero no encuentro la continuación de los 2 videos que siguen
Gracias
excelente saludos desde argentina !!!
muy bueno
me ayudo mucho gracias
Excelente hermano....
Saludos y exitos...
Hola soy nuevo en tu canal me ha llamado mucho la atención la manera y facil de enseñar...
espero me puedas ayudar cuando pones esta pequeña instrucción ul>li*5>a[href="#"]{Item $} se necesita de un plugin en sublime text para que al momento de ejecutar se cree todas las instrucciones ?? de ante mano muchas gracias.
+Jairo Alejandro Espejo Mendoza Seguí paso por paso, abri tu sublime text, presiona CTRL+SHIFT+P, te aparece un cuadro de texto, coloca install package control y dale enter, cuando termine de instalar, cerra y volve a abrir el sublime, despues presiona de nuevo CTRL+SHIFT+P y escribis emmet, le das enter y reinicias el sublime. Listo :)
+Yvan Koteski ¿Puede decirme el nombre del plugin que utiliza el? (hablo del que permite ver la pagina sin estar recargando). Gracias!
Gracias, asi si se entiende, muy bien explicado.
excelente, me ayudo mucho